[Manage Submissions] Updated tweak annotations

[michellexliu]

Summary

Summary generated by Reviewpad on 01 Dec 23 13:28 UTC

This pull request introduces several changes across multiple files:

1. In the file "app/views/submissions/index.html.erb":

   • Added stylesheet links for "annotations" and "jquery-ui".
   • Added a script block consisting of variable declarations and assignments.
   • Added external JavaScript includes for "jquery-ui", "autolab_component", "annotations_helpers", and "annotations_popup".
   • Added a modal div with ID "annotation-modal" and a nested div with class "modal-header".
   • Rendered a partial view called "annotation_popup" within the modal div.

2. In the newly added file "autolab_component.js":

   • Defined a function called "AutolabComponent" for creating instances of a component.
   • The component has a "template" function for defining its appearance and a "state" object for storing data.
   • The "setState" function extends the current state with a new state object and triggers a re-rendering of the component.
   • Demonstrated example usage of the component.

3. In the file "_annotation_form.html.erb":

   • Added a new <div> block with class input-field col <%= popup ? 's6' : 's12' %>.
   • Added an <input> element with class score, type number, value 0, placeholder 0, step any, and id comment-score.
   • Added a <label> element with for attribute set to comment-score.
   • Added a <span> element with a nested <b> element that displays dynamic text based on the @assessment.is_positive_grading variable.
   • Added an <i> (icon) element with a title attribute that displays dynamic text based on the @assessment.is_positive_grading variable.
   • Added a new <div> block with class input-field col s6 if the popup variable is true.
   • Within this new block, added a <select> element with class browser-default problem-id.

4. In the file "app/views/submissions/_annotation_global.html.erb":

   • Modified the render "annotation_form" command to include an additional parameter popup: false.

5. In the file "viewPDF.html.erb":

   • Added a JavaScript include tag for "annotations_helpers.js" and "annotations.js" if @preview_mode is false.

6. In the file "app/views/submissions/_annotations_js.html.erb":

   • Added a new line to include "annotations_helpers.js" using the <%= javascript_include_tag %> helper.

7. In the file "config/initializers/assets.rb":

   • Added "annotations_helpers.js" and "annotations_popup.js" to the list of assets to be precompiled.

8. In the file "manage_submissions.css":

   • Added a new CSS class .tweak-button with display: flex; and align-content: center; properties.
   • Added a hover effect to the .tweak-button class with cursor: pointer;.

9. In the file "manage_submissions.js":

   • Added new JavaScript code related to tweaking submissions, including functions for updating tweak buttons, retrieving total tweaks, creating and submitting new annotations, and updating existing annotations.

10. In the file "config/routes.rb":

    • Added a new route get "tweak_total" inside a nested resources block.

11. In the "Gemfile.lock" file:

    • Added a new platform, x86_64-darwin-21, under the PLATFORMS section.

12. In the file "app/views/submissions/_annotation_popup.html.erb":

    • Added a new file containing a modal popup for displaying annotations.

13. In the "AnnotationsController" class:

    • Modified the create method to update the annotation_params before creating a new annotation.
    • Removed a blank line in the shared_comments method.

14. In the "annotations_popup.js" file:

    • Added new functions for updating tweak buttons, retrieving tweak totals, generating HTML content for annotation forms, submitting new annotations, and updating existing annotations.

15. In the "annotations_helpers.js" file:

    • Added several functions and variables related to annotations.

16. In the "Annotation" model class:

    • Modified the as_json method to conditionally include additional attributes based on the presence of options[:seen_by].

17. In the file "manage_submissions.scss":

    • Added new CSS styles for .submissions-tweak-button, .submissions-tweak-points, and .submissions-checkbox classes.

18. In the file "_annotation.html.erb":

    • Modified the render statement for the annotation_form partial by adding popup: false.

19. In the file "_variables.scss":

    • Added new variables $autolab-subtle-gray and $autolab-highlight-gray.

20. In the "submissions_controller.rb" file:

    • Modified the before_action line to include the action tweak_total.
    • Added the @problems instance variable, assigned to the problems of the assessment.
    • Replaced the submissions.each loop with submissions.each_with_index.
    • Introduced the submission_info variable to store the JSON representation of the submissions.
    • Added the base_path, scores, and tweak_total attributes to each submission in submission_info.
    • Modified the render json line to include submission_info instead of just submissions.
    • Added the tweak_total action to calculate the tweak total for a submission.
    • Added a comment to describe the purpose of the downloadAll action.

21. In the "annotations.js" file:

    • Removed several functions and variables that are no longer needed or used in the code.

22. In the "config/routes.rb" file:

    • Added a new route for the "tweak_total" action.

23. In the "Gemfile.lock" file:

    • No changes were made in this file.

24. In the "app/views/submissions/_annotation_form.html.erb" file:

    • No changes were made in this file.

Please review these changes for any potential issues or improvements.

Description

Resolves #1850 Updates the manage submissions page to add a tweak via the usual annotations form, based on this design

https://github.com/autolab/Autolab/assets/50491000/ef8fe71a-01db-4063-be6b-c6ffe645fe23

Motivation and Context

• Makes it easier for instructors to annotations to individual submissions
• Deprecates old method of adding tweaks

How Has This Been Tested?

• [ ] Validate that existing global annotations show up as a tweak

For all of the following, validate that annotation gets shown in speedgrader, validate that amount of tweak shows up in tweak column

• [ ] Create new positive global annotation for a problem via tweak
• [ ] Create new positive global annotation for a different problem via tweak
• [ ] Create negative global annotation for a problem via tweak
• [ ] Create a new submission, add tweak

Types of changes

• [ ] Bug fix (non-breaking change which fixes an issue)
• [x] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

• [x] I have run rubocop for style check. If you haven't, run overcommit --install && overcommit --sign to use pre-commit hook for linting
• [ ] My change requires a change to the documentation, which is located at Autolab Docs
• [ ] I have updated the documentation accordingly, included in this PR

TODO

This PR only adds the ability to create a new annotation tweak. We still need to figure out how we want to handle pre-existing global annotations (since tweaks are now based on that) and how to show multiple tweaks for the same problem / adding easy editing functionality.