Expertiza_Wiki - User contributions [en]

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T05:12:48Z

Mshaikh: /* Implementation */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Final Design====
* When the instructor will select the show review report, it will show him the screen shown below.

[[File:Expertiza1.png]]

==== Implementation ====

This report is an enhancement of the review report.

* A new metric filter is provided so that the instructor can select the average author feedback, average length of comments, check and open the file if it is added by the reviewer.
* For the above implementation we have modified the following files: /app/views/_review_report.html.erb, app/controller/review_mapping_controller.rb, app/helper/review_mapping_helper.rb.
* The instructor can now also sort the reviewer by the name.
* We have taken the data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
* From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
* From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered in "/app/views/_review_report.html.erb".
*Hyperlinks are provided where necessary, so that the instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Final Design ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T05:12:22Z

Mshaikh: /* Pull Request and Demo */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Final Design====
* When the instructor will select the show review report, it will show him the screen shown below.

[[File:Expertiza1.png]]

==== Implementation ====

This report is an enhancement of the review report.

* A new metric filter is provided so that the instructor can select the average author feedback, average length of comments, check and open the file if it is added by the reviewer.
* For the above implementation we have modified the following files: /app/views/_review_report.html.erb, app/controller/review_mapping_controller.rb, app/helper/review_mapping_helper.rb.
* The instructor can now also sort the reviewer by the name.
** We have taken the data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered in "/app/views/_review_report.html.erb".
*Hyperlinks are provided where necessary, so that the instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Final Design ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T05:11:59Z

Mshaikh: /* Pull Request and Demo */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Final Design====
* When the instructor will select the show review report, it will show him the screen shown below.

[[File:Expertiza1.png]]

==== Implementation ====

This report is an enhancement of the review report.

* A new metric filter is provided so that the instructor can select the average author feedback, average length of comments, check and open the file if it is added by the reviewer.
* For the above implementation we have modified the following files: /app/views/_review_report.html.erb, app/controller/review_mapping_controller.rb, app/helper/review_mapping_helper.rb.
* The instructor can now also sort the reviewer by the name.
** We have taken the data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered in "/app/views/_review_report.html.erb".
*Hyperlinks are provided where necessary, so that the instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Final Design ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T05:11:32Z

Mshaikh: /* Implementation */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Final Design====
* When the instructor will select the show review report, it will show him the screen shown below.

[[File:Expertiza1.png]]

==== Implementation ====

This report is an enhancement of the review report.

* A new metric filter is provided so that the instructor can select the average author feedback, average length of comments, check and open the file if it is added by the reviewer.
* For the above implementation we have modified the following files: /app/views/_review_report.html.erb, app/controller/review_mapping_controller.rb, app/helper/review_mapping_helper.rb.
* The instructor can now also sort the reviewer by the name.
** We have taken the data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered in "/app/views/_review_report.html.erb".
*Hyperlinks are provided where necessary, so that the instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Final Design ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870.

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T05:10:43Z

Mshaikh: /* Mockups(Final Versions) */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Final Design====
* When the instructor will select the show review report, it will show him the screen shown below.

[[File:Expertiza1.png]]

==== Implementation ====

This report is an enhancement of the review report.

* A new metric filter is provided so that the instructor can select the average author feedback, average length of comments, check and open the file if it is added by the reviewer.
* For the above implementation we have modified the following files: /app/views/_review_report.html.erb, app/controller/review_mapping_controller.rb, app/helper/review_mapping_helper.rb.
* The instructor can now also sort the reviewer by the name.
** We have taken the data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered in "/app/views/_review_report.html.erb".
*Hyperlinks are provided where necessary, so that the instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Implementation ====

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Final Design ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870.

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T05:10:17Z

Mshaikh: /* Implementation Thoughts */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Final Design====
* When the instructor will select the show review report, it will show him the screen shown below.

[[File:Expertiza1.png]]

==== Implementation ====

This report is an enhancement of the review report.

* A new metric filter is provided so that the instructor can select the average author feedback, average length of comments, check and open the file if it is added by the reviewer.
* For the above implementation we have modified the following files: /app/views/_review_report.html.erb, app/controller/review_mapping_controller.rb, app/helper/review_mapping_helper.rb.
* The instructor can now also sort the reviewer by the name.
** We have taken the data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered in "/app/views/_review_report.html.erb".
*Hyperlinks are provided where necessary, so that the instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Implementation ====

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups(Final Versions) ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870.

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

File:Expertiza1.png

2016-12-03T04:48:51Z

Mshaikh:

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T04:47:09Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Final Design====
* When the instructor will select the show review report, it will show him the screen shown below.

[[File:Expertiza1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Implementation ====

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups(Final Versions) ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870.

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

File:Expertiza1.PNG

2016-12-03T04:45:53Z

Mshaikh:

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T04:43:27Z

Mshaikh: /* Pull Request and Demo */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Implementation ====

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups(Final Versions) ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870.

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T04:42:55Z

Mshaikh: /* Pull Request and Demo */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Implementation ====

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups(Final Versions) ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the Review report can be seen here: https://www.youtube.com/watch?v=mRgT9vdIizk
The pull request is here: https://github.com/expertiza/expertiza/pull/870
The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-12-03T04:39:27Z

Mshaikh: /* Use Cases */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

==== Implementation ====

==== Pull Request and Demo ====

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups(Final Versions) ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:Image11.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can select various rubric questions used for evaluation of that assignment.

[[File:Image22.png]]

* Once you click on the graph icon, it will take the instructor to the page shown below where the instructor can see the performance of the class based on various selected rubric questions.

[[File:Image33.png]]

==== Implementation ====

In order to implement the above functionality for the class performance report, we have finally implemented the following:

* We added a new controller ''ClassPerformanceController''.
* We added the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a number of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we added here routes to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view receives the following parameters.

<pre>
assignment_id
</pre>

The controller gets all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It then gets a list of all the rubrics used in those questionnaires from the ''Questions'' model. These are displayed to the instructor. It then routes the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers of those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

==== Pull Request and Demo ====

The demo for the class performance report can be seen here: https://youtu.be/_fp4YYCgY2w
The pull request is here: https://github.com/expertiza/expertiza/pull/861

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can any number of rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-15T01:48:41Z

Mshaikh: /* Use Cases */ Capybara

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:MockUps2.png]]

* Once you click on the graph icon it will take the instructor to the page shown below where instructor can see the performance of the class based on various rubric questions.

[[File:Mockups3.png]]

* The instructor can select the round 1 or round 2 from the drop-down menu.

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.
* '''RSpec''': RSpec is a behavior design development framework which is used for testing the functionality of the system.
* ''' Capybara''': We will be using capybara for automation of the manual test cases written in RSpec.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-15T01:43:56Z

Mshaikh: /* Use Cases */ Rspec

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:MockUps2.png]]

* Once you click on the graph icon it will take the instructor to the page shown below where instructor can see the performance of the class based on various rubric questions.

[[File:Mockups3.png]]

* The instructor can select the round 1 or round 2 from the drop-down menu.

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.
* '''RSpec''': RSpec is a behavior design development framework which is used for testing the functionality of the system.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T04:26:09Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:MockUps2.png]]

* Once you click on the graph icon it will take the instructor to the page shown below where instructor can see the performance of the class based on various rubric questions.

[[File:Mockups3.png]]

* The instructor can select the round 1 or round 2 from the drop-down menu.

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

File:Mockups3.png

2016-11-10T04:25:10Z

Mshaikh:

File:Mockups3.PNG

2016-11-10T04:16:49Z

Mshaikh:

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T03:18:01Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:MockUps2.png]]

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

File:MockUps2.png

2016-11-10T03:17:18Z

Mshaikh:

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T03:08:10Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====
* The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.

[[File:MockUp2.png]]

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T03:07:46Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
* When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====
The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.
[[File:MockUp2.png]]

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T03:04:43Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====
The instructor can view the class performance on assignments by clicking on the graph icon on the assignments page as shown below.
[[File:MockUp2.png]]

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

File:MockUp2.png

2016-11-10T03:01:58Z

Mshaikh:

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T01:28:13Z

Mshaikh: /* Task Description */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table for review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T01:27:25Z

Mshaikh:

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Create a new table review and author feedback report.
* The new table should have the following information: reviewer name, the number of reviews he has done, length of reviews, review summary, whether there is a link or a file attached, Average author feedback rating per team, Author feedback summary and a field where an instructor can give his grades and write comments.
* Add interactive visualization to show the class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T00:46:47Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Add a new column to give the length of reviews.
* Separate data from columns number of reviews and summary details.
* Create a new column to check if a reviewer added a link or a file.
* Create a new column to check the average author feedback rating per team.
* Add interactive visualization to show class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
When the author will select the review and author feedback, it will show him the screen shown below.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016 E1709 Visualizations for instructors

2016-11-10T00:44:54Z

Mshaikh: /* Mockups */

== Introduction ==

Expertiza<ref>https://expertiza.ncsu.edu/</ref> is an open-source web application to create re-usable learning objects through peer-reviews to facilitate incremental learning. Students can submit learning objects such as articles, wiki pages, repository links and with the help of peer reviews, improve them. The project has been developed using the Ruby on Rails<ref>https://en.wikipedia.org/wiki/Ruby_on_Rails</ref> framework and is supported by the [http://www.nsf.gov National Science Foundation].

== Project Description ==

=== Purpose and Scope ===

Expertiza assignments are based on a peer review system where the instructor creates rubrics for an assignment through questionnaires which students use to review other students' submissions. The author of the submission is given an opportunity to provide feedback about these reviews. All questions in the questionnaire have an assigned grade which is based on a pre-defined grading scale. Instructors can see a report on the scores of a student given by reviewers, on the score of feedback given to the reviewers and many other reports. Based on these reports (which are all on separate pages), the instructors grade the student. These reports are, however, on separate pages and it is difficult for an instructor to navigate to many pages before grading the student. The first requirement is meant to solve this problem by merging the review scores with the author feedbacks on the same page.

Furthermore, there is no way for an instructor to evaluate the rubric he/she has posted on assignments. Students may consistently be getting negative reviews for a rubric which might not be totally relevant to the assignment thereby reducing their scores. A report of average class scores for each rubric in the questionnaires would help instructors refactor their rubric and understand where students generally perform well and where they struggle. This new report forms the second part of the requirement.

We are not modifying any of the existing functionalities of Expertiza. Our work would involve modifying the review report and creating a new report for average class scores.

=== Task Description ===

The project requires completion of the following tasks:

* Integrate review data with author feedback data to help instructors grade the reviewers.
* Add a new column to give the length of reviews.
* Separate data from columns number of reviews and summary details.
* Create a new column to check if a reviewer added a link or a file.
* Create a new column to check the average author feedback rating per team.
* Add interactive visualization to show class performance of an assignment to an instructor.
* Create a new route/view/controller for class performance.
* Add a new link to point to the new controller created. This new link will be created per assignment.
* Create two new views, one for selecting rubric criteria and second to show the graph.
* Create graphs to show the class performance as per the rubric metrics selected dynamically.

== Project Design ==

=== Design Patterns ===

'''Iterator Pattern<ref>https://en.wikipedia.org/wiki/Iterator_pattern</ref>:'''
The iterator design pattern uses an iterator to traverse a container and access its elements. When we are implementing the response and author feedback report, we will be iterating through each reviewer to get the review performed by them and then each author based on the feedback given for each review. This iteration will occur with the data returned by the ResponseMap model for all of the review and feedback information. For the class performance report, we will be iterating through each questionnaire per assignment, and thereafter each question per questionnaire. The same iteration will also be required to get answers per question per reviewer.

'''MVC Pattern<ref>https://www.tutorialspoint.com/design_pattern/mvc_pattern.htm</ref>:'''
In the MVC design pattern a controller processes the request, interprets the data in model and then renders particular view.
For rendering response and author feedback report, we check the the data, in the form that was submitted from the UI, in the ResponseMappingController. Depending on the data, we process various models and then display a particular view.

=== Review and Author Feedback Report ===

==== Workflow ====
[[File:workflow1.png]]

==== Mockups ====
Below is the initial concept of how the page will look like.

[[File:Mockup1.png]]

==== Implementation Thoughts ====

This report is an integration of two preexisting reports "Review"and "Author Feedback". Thus we will be reusing a lot of components with addition of few.

* A new option will be provided in the dropdown called as "Review and Author Feedback Report".
* On submitting this form, the user is redirected to action "response_report" in controller "ReviewMappingController".
* We will add new case for our requirement.
** We will require data from ReviewResponseMap, FeedbackResponseMap, AssignmentParticipant models.
** From ReviewResponseMap and AssignmentParticipant, for each reviewer we will get number of reviews completed, length of reviews, summary of reviews and whether reviewers had added a file or link for their review.
** From FeedbackResponseMap, we will get author feedback summary and the total score that author gave for the particular reviewer.
* All the above data will be rendered using a new partial "_response_and_feedback.html.erb" in "/app/views/review_mapping". This partial is called from "response_report.html.haml".
* In a similar tabular format for Review/ Author feedback report, we will show the data in a table.
*Hyperlinks will be provided where necessary, so instructor can view additional details. For e.g. to view review summary or author feedback summary.

=== Class Performance Report ===

==== Workflow ====
[[File:workflow3.png]]

==== Mockups ====

==== Implementation Thoughts ====

In order to implement the above functionality for the class performance report, our initial observation resulted in the following path for implementation.

* We will need a new controller ''ClassPerformanceController''.
* We will need the following two new views.
** A view to ''select_rubrics''. This view will allow instructors to select a couple of rubrics to evaluate the class performance on.
** A view to ''show_class_performance''. This view will display the class performance using relevant graphs to represent the information clearly.
* Routes for each of the views created.
* Model methods to facilitate getting the required information and calculations.

We need to provide a link to the instructor to see this view. As shown above, this will be a button in the assignment management page routed at ''tree_display/list'' which corresponds to the function ''list'' in the controller ''TreeDisplayController.rb''. The button we are adding here to route to the newly created ''select_rubrics'' view.

The ''select_rubrics'' view will receive the following parameters.

<pre>
assignment_id
</pre>

The controller will get all the questionnaires related to that assignment from the ''AssignmentQuestionnaire'' model. It will then get a list of all the rubrics used in those questionnaires from the ''Questions'' model. These will be displayed to the instructor. It will then route the instructor to the ''show_class_performance'' view upon selection of rubrics. It will pass the following parameters to the ''show_class_performance'' view.

<pre>
assignment_id
Array[question_id]
</pre>

The controller will take the list of questions for the assignment and find all the answers for those questions. It will then calculate the average score per question for the entire class from those answers and pass this to the view. The ''show_class_performance'' view will use the [https://github.com/topfunky/gruff Gruff API] in order to provide an aesthetically appealing visualization of the data.

== Use Cases ==

* '''View Review and Author Feedback Report as Instructor''': As an instructor, he can see the different metrics of reviews and average feedback rating received per student done for an assignment or a project.
* '''View Class Performance as Instructor''': As an instructor, he can select 5 rubric metrics used per assignment. The instructor is able to see the graph to check the class performance based upon the metrics selected.

== Test Plan ==

*'''For use case 1''', test if the instructor can see the text metrics of reviews and author feedbacks received for an assignment or a project per student.
*'''For use case 2''', test if the instructor can select 5 rubric metrics used for an assignment. Also, test if the instructor can view the class performance from a graph using the metrics selected by the instructor.

== Requirements ==

While software and hardware requirements are the same as current Expertiza system, we will require following addition tools:

* '''Tools:''' Gruff API in addition to the current Expertiza system.

== References ==
<references/>

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-11-03T20:16:12Z

Mshaikh:

[https://servo.org Servo] is a modern high-performance web browser developed by Mozilla with Samsung porting it on android and arm processors<ref>https://en.wikipedia.org/wiki/Servo_(layout_engine)</ref>. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a newly developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements HTML form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines a set of specifications which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Its source code can be found [https://github.com/servo/servo here]. Current browser engines are mostly based on the single-thread model. The motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source system programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe system. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout<ref>https://en.wikipedia.org/wiki/Rust_(programming_language)</ref>.

=='''Project description'''==
===Build process===
* The project begin with installing and compiling the servo browser<ref>https://github.com/servo/servo/wiki/Form-validation-student-project</ref>. For different operating systems the dependencies are different. We installed it on Ubuntu using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the original servo repository and cloned the forked repository on our local machines and then compiled and ran the servo browser.

cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

===Initial steps===

*Add new enum that represents each possible validity check in <code>ValidityState</code>.

*Define a <code>Validatable</code> [https://doc.rust-lang.org/1.12.0/book/traits.html trait] that contains a method which accepts this enum as an argument.

*Implement this trait for different form element types (<code>HTMLInputElement</code>, <code>HTMLButtonElement</code>, etc.), and define an as_maybe_validatable method on Element which returns an <code>&Validatable</code> value if the element implements the trait.

*Use <code>JS<Element></code> member to call these new methods in <code>ValidityState</code>.

*We pushed the code to the servo and the pull request is [https://github.com/servo/servo/pull/13969 #13969]. The servo team requires only one commit so that all modifications we made are in that single commit.

===Implemented steps===
*Defined a trait <code>Validatable</code> in <code>validation.rs</code> file that contains methods to be used for validating an html element.
[[File:Validatable.PNG]]

*The traits for different form elements like Input text, Input submit, Input Button, Input Image are defined in htmlInputElement.rs
[[File:Inputelement.PNG]]

*The code below will check the type of elements from the form and if they are input elements then it will call the <code>is_instance_validatable</code> function to check the validation.
[[File:Formelement.PNG]]

===Challenges faced===
* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 #13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by <code>./mach run tests/html/about-mozilla.html -c</code> and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

===Subsequent steps===
* We will be adding methods so that we can statically and dynamically validate the constraints of the form element.
* We will implement the checkValidity and ReportValidity API for HTML form element.
* We will implement the validity state defined in the spec and implement the form submission algorithm to include the constraint validation.

=='''Design patterns & o-o practices'''==
This project is to add some features to servo, so we were not supposed to change the design of original servo project. Throughout the development process, we tried to follow good o-o practices by following DRY, giving the elements and functions the correct names and we tried and maintained the servo and rust coding standards.

=='''Test'''==
===Test with tidy===
Servo has its own code standard. We managed to meet its code standard by using the following command to run code style check.

cd servo
./mach test-tidy

When we ran tidy we got 20 code style errors and we fixed all the errors.
===Compile test===
After adding code, we compiled the servo by the following command

cd servo
./mach build -d

No error showed up, servo worked as expected with the new code.
===Test from UI===
At this stage, the project can't be tested from UI. There are still some subsequent steps to be implemented after this.

===For reviewers===
In addition to the reasons mentioned above, the servo is a web browser and not a web application. Therefore it can't be deployed on the cloud server. All these would make it hard for reviewers to test the correctness of code at this time.

=='''References'''==
<references />

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-29T05:00:34Z

Mshaikh: /* Testing */

[https://servo.org Servo] is a modern high performance web browser developed by Mozilla with Samsung porting it on android and arm processors<ref>https://en.wikipedia.org/wiki/Servo_(layout_engine)</ref>. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a new developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements html form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines set of specification which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Its source code can be found [https://github.com/servo/servo here]. Current browser engines are mostly based on single-threaded model. Motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source systems programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe systems. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout<ref>https://en.wikipedia.org/wiki/Rust_(programming_language)</ref>.

=='''Project description'''==
===Build process===
* The project begin with installing and compiling the servo browser<ref>https://github.com/servo/servo/wiki/Form-validation-student-project</ref>. For different operating systems the dependencies are different. We installed it on Ubuntu using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the original repository from servo and cloned the forked repository on our local machines and then compiled and ran the servo browser.

cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

===Initial steps===

*Add new enum that represents each possible validity check in <code>ValidityState</code>.

*Define a <code>Validatable</code> [https://doc.rust-lang.org/1.12.0/book/traits.html trait] that contains a method which accepts this enum as an argument.

*Implement this trait for different form element types (<code>HTMLInputElement</code>, <code>HTMLButtonElement</code>, etc.), and define an as_maybe_validatable method on Element which returns an <code>&Validatable</code> value if the element implements the trait.

*Use <code>JS<Element></code> member to call these new methods in <code>ValidityState</code>.

*We pushed the code to the servo and the pull request is [https://github.com/servo/servo/pull/13969 #13969]. The servo team requires only one commit so that all modifications we made are in that single commit.

===Implemented steps===
*Defined a trait <code>Validatable</code> in <code>validation.rs</code> file that contains methods to be used for validating an html element.
[[File:Validatable.PNG]]

*The traits for different form elements like Input text, Input submit, Input Button, Input Image are defined in htmlInputElement.rs
[[File:Inputelement.PNG]]

*The code below will check the type of elements from the form and if they are input elements then it will call the <code>is_instance_validatable</code> function to check the validation.
[[File:Formelement.PNG]]

===Challenges faced===
* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 #13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by <code>./mach run tests/html/about-mozilla.html -c</code> and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

===Subsequent steps===
* We will be adding methods so that we can statically and dynamically validate the constraints of the form element.
* We will implement the checkValidity and ReportValidity API for HTML form element.
* We will implement the validity state defined in the spec and implement the form submission algorithm to include the constraint validation.

=='''Design patterns & o-o practices'''==
This project is to add some features to servo, so we were not supposed to change the design of original servo project. Throughout the development process we tried to follow good o-o practices by following DRY, giving the elements and functions the correct names and we tried and maintained the servo and rust coding standards.

=='''Testing'''==
===Testing with tidy===
Servo has its own code standard. We managed to meet its code standard by using the following command to run code style check.

cd servo
./mach test-tidy

When we ran tidy we got 20 code style errors and we fixed all the errors.

=='''References'''==
<references />

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-29T04:51:59Z

Mshaikh: /* Implemented steps */

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-29T04:42:55Z

Mshaikh: /* Design patterns & o-o practices */

[https://servo.org Servo] is a modern high performance web browser developed by Mozilla with Samsung porting it on android and arm processors<ref>https://en.wikipedia.org/wiki/Servo_(layout_engine)</ref>. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a new developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements html form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines set of specification which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Its source code can be found [https://github.com/servo/servo here]. Current browser engines are mostly based on single-threaded model. Motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source systems programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe systems. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout<ref>https://en.wikipedia.org/wiki/Rust_(programming_language)</ref>.

=='''Project description'''==
===Build process===
* The project begin with installing and compiling the servo browser<ref>https://github.com/servo/servo/wiki/Form-validation-student-project</ref>. For different operating systems the dependencies are different. We installed it on Ubuntu using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the original repository from servo and cloned the forked repository on our local machines and then compiled and ran the servo browser.

cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

===Initial steps===

*Add new enum that represents each possible validity check in <code>ValidityState</code>.

*Define a <code>Validatable</code> [https://doc.rust-lang.org/1.12.0/book/traits.html trait] that contains a method which accepts this enum as an argument.

*Implement this trait for different form element types (<code>HTMLInputElement</code>, <code>HTMLButtonElement</code>, etc.), and define an as_maybe_validatable method on Element which returns an <code>&Validatable</code> value if the element implements the trait.

*Use <code>JS<Element></code> member to call these new methods in <code>ValidityState</code>.

*We pushed the code to the servo and the pull request is [https://github.com/servo/servo/pull/13969 #13969]. The servo team requires only one commit so that all modifications we made are in that single commit.

===Implemented steps===
*Defined a trait <code>Validatable</code> in <code>validation.rs</code> file that contains methods to be used for validating an html element.
[[File:Validatable.PNG]]

*We implemented this trait for different form elements
[[File:Inputelement.PNG]]

*Add code to circularly check the type of elements, if it is input elements then calls <code>is_instance_validatable</code>
[[File:Formelement.PNG]]

===Challenges faced===
* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 #13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by <code>./mach run tests/html/about-mozilla.html -c</code> and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

===Subsequent steps===
* We will be adding methods so that we can statically and dynamically validate the constraints of the form element.
* We will implement the checkValidity and ReportValidity API for HTML form element.
* We will implement the validity state defined in the spec and implement the form submission algorithm to include the constraint validation.

=='''Design patterns & o-o practices'''==
This project is to add some features to servo, so we were not supposed to change the design of original servo project. Throughout the development process we tried to follow good o-o practices by following DRY, giving the elements and functions the correct names and we tried and maintained the servo and rust coding standards.

=='''Testing'''==
===Testing with tidy===
Servo has its own code standard. We managed to meet its code standard by using the following command to run code style check.

cd servo
./mach test-tidy

When we ran tidy we got 20 code style errors and we fixed all the errors.

===Testing with ui===

We created a test form to check our validation function.

=='''References'''==
<references />

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-29T04:38:44Z

Mshaikh: Added Subsequent steps

[https://servo.org Servo] is a modern high performance web browser developed by Mozilla with Samsung porting it on android and arm processors<ref>https://en.wikipedia.org/wiki/Servo_(layout_engine)</ref>. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a new developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements html form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines set of specification which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Its source code can be found [https://github.com/servo/servo here]. Current browser engines are mostly based on single-threaded model. Motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source systems programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe systems. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout<ref>https://en.wikipedia.org/wiki/Rust_(programming_language)</ref>.

=='''Project description'''==
===Build process===
* The project begin with installing and compiling the servo browser<ref>https://github.com/servo/servo/wiki/Form-validation-student-project</ref>. For different operating systems the dependencies are different. We installed it on Ubuntu using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the original repository from servo and cloned the forked repository on our local machines and then compiled and ran the servo browser.

cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

===Initial steps===

*Add new enum that represents each possible validity check in <code>ValidityState</code>.

*Define a <code>Validatable</code> [https://doc.rust-lang.org/1.12.0/book/traits.html trait] that contains a method which accepts this enum as an argument.

*Implement this trait for different form element types (<code>HTMLInputElement</code>, <code>HTMLButtonElement</code>, etc.), and define an as_maybe_validatable method on Element which returns an <code>&Validatable</code> value if the element implements the trait.

*Use <code>JS<Element></code> member to call these new methods in <code>ValidityState</code>.

*We pushed the code to the servo and the pull request is [https://github.com/servo/servo/pull/13969 #13969]. The servo team requires only one commit so that all modifications we made are in that single commit.

===Implemented steps===
*Defined a trait <code>Validatable</code> in <code>validation.rs</code> file that contains methods to be used for validating an html element.
[[File:Validatable.PNG]]

*We implemented this trait for different form elements
[[File:Inputelement.PNG]]

*Add code to circularly check the type of elements, if it is input elements then calls <code>is_instance_validatable</code>
[[File:Formelement.PNG]]

===Challenges faced===
* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 #13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by <code>./mach run tests/html/about-mozilla.html -c</code> and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

===Subsequent steps===
* We will be adding methods so that we can statically and dynamically validate the constraints of the form element.
* We will implement the checkValidity and ReportValidity API for HTML form element.
* We will implement the validity state defined in the spec and implement the form submission algorithm to include the constraint validation.

=='''Design patterns & o-o practices'''==
This project is to add some features to servo, so we were not supposed to change the design of original servo project. We used enum and tried to follow good o-o practices in the process of development.

=='''Testing'''==
===Testing with tidy===
Servo has its own code standard. We managed to meet its code standard by using the following command to run code style check.

cd servo
./mach test-tidy

When we ran tidy we got 20 code style errors and we fixed all the errors.

===Testing with ui===

We created a test form to check our validation function.

=='''References'''==
<references />

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-29T01:48:53Z

Mshaikh:

[https://servo.org Servo] is a modern high performance web browser developed by Mozilla with Samsung porting it on android and arm processors<ref>https://en.wikipedia.org/wiki/Servo_(layout_engine)</ref>. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a new developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements html form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines set of specification which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Its source code can be found [https://github.com/servo/servo here]. Current browser engines are mostly based on single-threaded model. Motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source systems programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe systems. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout<ref>https://en.wikipedia.org/wiki/Rust_(programming_language)</ref>.

=='''Project Description'''==
===Build Process===
* The project <ref>https://github.com/servo/servo/wiki/Form-validation-student-project</ref> begin with installing and compiling the servo browser. For different Operating systems the dependencies are different. We installed it on Ubuntu 14.04 using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the original repository from servo and cloned the forked repository on our local machines and then compiled and ran the servo browser.

cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

===Initial Steps===

*Add new enum that represents each possible validity check in <code>ValidityState</code>.

*Define a <code>Validatable</code> [https://doc.rust-lang.org/1.12.0/book/traits.html trait] that contains a method which accepts this enum as an argument.

*Implement this trait for different form element types (<code>HTMLInputElement</code>, <code>HTMLButtonElement</code>, etc.), and define an as_maybe_validatable method on Element which returns an <code>&Validatable</code> value if the element implements the trait.

*Use <code>JS<Element></code> member to call these new methods in <code>ValidityState</code>.
* We pushed the code to the servo and the pull request is [https://github.com/servo/servo/pull/13969 13969].

===Implemented Steps===
* Defined a trait Validatable in validation.rs file that contains methods to be used for validating an html element.
===Challenges Faced===
* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 #13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by <code>./mach run tests/html/about-mozilla.html -c</code> and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

=='''Design Patterns & OO Practices'''==
This project is to add some feature to servo, so we were not supposed to change the design of original servo project. We used Enum and tried to follow good OO practices in the process of development.

=='''Testing'''==
===Testing with Tidy===
Servo has its own code standard. We managed to meet its code standard. We use following command to run code style check.

cd servo
./mach test-tidy

When we ran tidy we got 20 syntactic errors and we fixed all the errors.

===Testing with UI===

We created a test form to check whether the validation was working or not.
=='''References'''==
<references />

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-29T01:27:34Z

Mshaikh:

[https://servo.org Servo] is a modern high performance web browser developed by Mozilla with Samsung porting it on android and arm processors<ref>https://en.wikipedia.org/wiki/Servo_(layout_engine)</ref>. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a new developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements html form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines set of specification which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Its source code can be found [https://github.com/servo/servo here]. Current browser engines are mostly based on single-threaded model. Motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source systems programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe systems. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout<ref>https://en.wikipedia.org/wiki/Rust_(programming_language)</ref>.

=='''Project Description'''==
===Build Process===
* The project <ref>https://github.com/servo/servo/wiki/Form-validation-student-project</ref> begin with installing and compiling the servo browser. For different Operating systems the dependencies are different. We installed it on Ubuntu 14.04 using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the original repository from servo and cloned the forked repository on our local machines and then compiled and ran the servo browser.

cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

===Initial Implementation===

*Add new enum that represents each possible validity check in <code>ValidityState</code>.

*Define a <code>Validatable</code> [https://doc.rust-lang.org/1.12.0/book/traits.html trait] that contains a method which accepts this enum as an argument.

*Implement this trait for different form element types (<code>HTMLInputElement</code>, <code>HTMLButtonElement</code>, etc.), and define an as_maybe_validatable method on Element which returns an <code>&Validatable</code> value if the element implements the trait.

*Use <code>JS<Element></code> member to call these new methods in <code>ValidityState</code>.
* We pushed the code to the servo and the pull request is [https://github.com/servo/servo/pull/13969 13969].
===Challenges Faced===
* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 #13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by <code>./mach run tests/html/about-mozilla.html -c</code> and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

=='''Design Patterns & OO Practices'''==
This project is to add some feature to servo, so we were not supposed to change the design of original servo project. We used Enum and tried to follow good OO practices in the process of development.

=='''Testing'''==
===Testing with Tidy===
Servo has its own code standard. We managed to meet its code standard. We use following command to run code style check.

cd servo
./mach test-tidy

When we ran tidy we got 20 syntactic errors and we fixed all the errors.

===Testing with UI===

We created a test form to check whether the validation was working or not.
=='''References'''==
<references />

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-28T18:18:48Z

Mshaikh:

''' Implementation of HTML5 form validation in servo'''

----
[https://servo.org Servo] is a modern high performance web browser developed by Mozilla with Samsung porting it on android and arm processors<ref>https://en.wikipedia.org/wiki/Servo_(layout_engine)</ref>. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a new developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements html form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines set of specification which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Its source code can be found [https://github.com/servo/servo here]. Current browser engines are mostly based on single-threaded model. Motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source systems programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe systems. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout<ref>https://en.wikipedia.org/wiki/Rust_(programming_language)</ref>.

=='''Project Description<ref>https://github.com/servo/servo/wiki/Form-validation-student-project</ref>'''==
* The project begin with installing and compiling the servo browser. For different Operating systems the dependencies are different. We installed it on Ubuntu 14.04 using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the original repository from servo and cloned the forked repository on our local machines and then compiled and ran the servo browser.

cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

*Add new enum that represents each possible validity check in <code>ValidityState</code>.

*Define a <code>Validatable</code> [https://doc.rust-lang.org/1.12.0/book/traits.html trait] that contains a method which accepts this enum as an argument.

*Implement this trait for different form element types (<code>HTMLInputElement</code>, <code>HTMLButtonElement</code>, etc.), and define an as_maybe_validatable method on Element which returns an <code>&Validatable</code> value if the element implements the trait.

*Use <code>JS<Element></code> member to call these new methods in <code>ValidityState</code>.
===Challenges Faced===
* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 #13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by <code>./mach run tests/html/about-mozilla.html -c</code> and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

=='''Design Patterns & OO Practices'''==
This project is to add some feature to servo, so we were not supposed to change the design of original servo project. We used Enum and tried to follow good OO practices in the process of development.

=='''Testing'''==
Servo has its own code standard. We managed to meet its code standard. We use following command to run code style check.

cd servo
./mach test-tidy

=='''References'''==
<references />

CSC/ECE 517 Fall 2016/M1653 Implement HTML form validation

2016-10-28T03:31:46Z

Mshaikh:

''' Implementation of HTML5 form validation in servo'''

----
[https://servo.org Servo] is a modern high performance web browser developed by Mozilla with Samsung porting it on android and arm processors. The source code is written in the [https://www.rust-lang.org/en-US/ rust] programming language, which is a new developed system level programming language. The major advantage of rust language is that it is thread-safe<ref>https://www.rust-lang.org/en-US/</ref>. This project implements html form validation on servo browser.

=='''Introduction'''==
The [https://en.wikipedia.org/wiki/HTML5 HTML5]is a markup language used for content organizing and showing on the World Wide Web<ref>https://en.wikipedia.org/wiki/HTML5</ref>. It defines set of specification which users needs to follow to make web pages HTML5 compliant. In HTML 5 there is a major type of element which is form element. When user trying to submit their form, the system should be able to check the validation status of this form and decide whether accept this form or reject the request. HTML provides such mechanism. Using this mechanism will allow the system to check whether the contents of forms are validated before it is allowed to submit. [https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] currently implements validation check for some of the form element types. The objective of this project is to define and implement validation check function and implement validate step for these HTML5 form elements.

===Servo===
[https://en.wikipedia.org/wiki/Servo_(layout_engine) Servo] is an open source prototype web browser layout engine that is being developed by Mozilla Research. Current browser engines are mostly based on single-threaded model. Motivation behind building servo web browser is to build a highly parallel and reliable environment, where different components (such as rendering, layout, HTML parsing, image decoding, etc.) can be handled by fine-grained, isolated tasks.

===Rust===
[http://doc.rust-lang.org/book/README.html Rust] is an open source systems programming language developed by Mozilla. Rust is a language suited for creating a highly concurrent and safe systems. In performance and syntax, rust is similar to C++ but semantically it is very different. Rust emphasis is on speed, safety and control of memory layout.

=='''Project Description'''==
* The project begin with installing and compiling the servo browser. For different Operating systems the dependencies are different. We installed it on Ubuntu 14.04 using the following commands.

On Debian-based Linuxes:

sudo apt-get install curl freeglut3-dev \
libfreetype6-dev libgl1-mesa-dri libglib2.0-dev xorg-dev \
msttcorefonts gperf g++ cmake python-virtualenv \
libssl-dev libglfw-dev

* We then forked the repository and cloned it on our computers and then compiled and ran the servo browser.

git clone https://github.com/servo/servo
cd servo
./mach build --dev
./mach run tests/html/about-mozilla.html

* While building the servo as shown above we were getting GLSL 1.50 is not supported error. We investigated this issue and found that there was an open issue [https://github.com/servo/servo/issues/13515 13515]. We found that the error was because the rendering was done with Nvidia graphics card and so we changed it to the intel graphics card by ./mach run tests/html/about-mozilla.html -c and were able to run the browser. We even updated the open thread so that other people can take advantage of that.

=='''Design Patterns & OO Practices'''==
We were not supposed to change the design apart from adding a new behaviour/ability for HTML Element. We tried to follow good OO practices throughout the development process. We always tried to follow the DRY principle in order to avoid repetition of code. Servo has it's own coding standards which are checked by running following command.

<code>
./mach test-tidy
</code>

Using the above code there were a few issues generated and we have fixed all the issues.

=='''References'''==
<references />
1. https://doc.rust-lang.org/stable/book/ 
2. https://en.wikipedia.org/wiki/Rust_(programming_language) 
3. https://en.wikipedia.org/wiki/Servo_(layout_engine) 
4. https://github.com/servo/servo/wiki/Form-validation-student-project 
5. https://doc.rust-lang.org/book/ 
6. http://wiki.expertiza.ncsu.edu/index.php/CSC/ECE_517_Spring_2016/Mozilla_Implement_HTML5_form_validation