[FC-0047] - Requirements for the offline xblocks running
Table of Drag and Drop actions:
Action | Description | Screenshot |
---|---|---|
|
|
Clicking to the Drag and Drop item.
|
|
|
Move Drag and Drop item to the Drag and Drop zone.
|
|
|
Close feedback message. |
|
|
Incorrect answer. |
|
|
Reset.
|
|
|
Keyboard Help.
|
Library content with offline mode.
The components from Library behave the same way as the components inherit from capa problem (Checkboxes, Multiple Choice, Numerical Input, Text Input etc.)
Implementation for text problem and video problem already exist.Staff Graded Assignment actions table.
Action | Description | Screenshot |
---|---|---|
|
|
Upload your assignment
|
|
|
Grade Submissions
Submissions table
|
|
|
Submit uploaded file
|
|
|
Enter grade
|
|
|
Upload annotated file
|
Annotatable problem table.
Requests and responses to the server almost completely correspond to those described in the capa problem article. The only difference is in the Payload of the the requestproblem_check
.
Action | Description | Screenshot |
---|---|---|
Submit | Submit answer and annotation: Event: input_273825134dcc433abbb012fa5e660d4d_2_1_comment=Lorem+ipsum+dolor+sit+amet%2C+consectetur+adipiscing+elit.+Ut+sodales+laoreet+est%2C+egestas+gravida+felis+egestas+nec.+Aenean+at+volutpat+erat.+Cras+commodo+viverra+nibh+in+aliquam.&input_273825134dcc433abbb012fa5e660d4d_2_1=%7B%22options%22%3A%5B1%5D%2C%22comment%22%3A%22Lorem+ipsum+dolor+sit+amet%2C+consectetur+adipiscing+elit.+Ut+sodales+laoreet+est%2C+egestas+gravida+felis+egestas+nec.+Aenean+at+volutpat+erat.+Cras+commodo+viverra+nibh+in+aliquam.%22%7D Response: {
"success": "correct",
"contents": "\n\n\n\n<h3 class=\"hd hd-3 problem-header\" id=\"273825134dcc433abbb012fa5e660d4d-problem-title\" aria-describedby=\"block-v1:f+f+f+type@problem+block@273825134dcc433abbb012fa5e660d4d-problem-progress\" tabindex=\"-1\">\n Blank Problem\n</h3>\n\n<div class=\"problem-progress\" id=\"block-v1:f+f+f+type@problem+block@273825134dcc433abbb012fa5e660d4d-problem-progress\"></div>\n\n<div class=\"problem\">\n <div>\n <div class=\"wrapper-problem-response\" tabindex=\"-1\" aria-label=\"Question 1\" role=\"group\"><div class=\"annotation-input\">\n<div class=\"script_placeholder\" data-src=\"/static/js/capa/annotationinput.js\"/>\n\n<div class=\"annotation-header\">\n Annotation Exercise\n\n <a class=\"annotation-return\" href=\"javascript:void(0)\">Return to Annotation</a><br/>\n</div>\n<div class=\"annotation-body\">\n\n <div class=\"block block-highlight\">PLACEHOLDER: Text of annotation</div>\n <div class=\"block block-comment\">PLACEHOLDER: Text of question</div>\n\n <div class=\"block\">PLACEHOLDER: Type your response below:</div>\n <textarea class=\"comment\" id=\"input_273825134dcc433abbb012fa5e660d4d_2_1_comment\" name=\"input_273825134dcc433abbb012fa5e660d4d_2_1_comment\" aria-describedby=\"answer_273825134dcc433abbb012fa5e660d4d_2_1\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sodales laoreet est, egestas gravida felis egestas nec. Aenean at volutpat erat. Cras commodo viverra nibh in aliquam.</textarea>\n\n <div class=\"block\" id=\"label_273825134dcc433abbb012fa5e660d4d_2_1\">PLACEHOLDER: In your response to this question, which tag below do you choose?</div>\n <ul class=\"tags\">\n <li>\n\n <span class=\"tag \" data-id=\"0\">\n PLACEHOLDER: Incorrect answer (to make this option a correct or partially correct answer, change choice=\"incorrect\" to choice=\"correct\" or choice=\"partially-correct\")\n </span>\n </li>\n <li>\n <span class=\"tag-status correct\" aria-describedby=\"input_273825134dcc433abbb012fa5e660d4d_2_1_comment\">\n \n\n<span class=\"status correct\" data-tooltip=\"This answer is correct.\">\n <span class=\"sr\">correct</span><span class=\"status-icon\" aria-hidden=\"true\"/>\n</span>\n\n </span>\n\n <span class=\"tag selected \" data-id=\"1\">\n PLACEHOLDER: Correct answer (to make this option an incorrect or partially correct answer, change choice=\"correct\" to choice=\"incorrect\" or choice=\"partially-correct\")\n </span>\n </li>\n <li>\n\n <span class=\"tag \" data-id=\"2\">\n PLACEHOLDER: Partially correct answer (to make this option a correct or partially correct answer, change choice=\"partially-correct\" to choice=\"correct\" or choice=\"incorrect\")\n \n </span>\n </li>\n </ul>\n\n <input type=\"hidden\" class=\"value\" name=\"input_273825134dcc433abbb012fa5e660d4d_2_1\" id=\"input_273825134dcc433abbb012fa5e660d4d_2_1\" value=\"{"options":[1],"comment":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sodales laoreet est, egestas gravida felis egestas nec. Aenean at volutpat erat. Cras commodo viverra nibh in aliquam."}\"/>\n\n \n\n<span class=\"status correct\" id=\"status_273825134dcc433abbb012fa5e660d4d_2_1\" data-tooltip=\"This answer is correct.\">\n <span class=\"sr\">correct</span><span class=\"status-icon\" aria-hidden=\"true\"/>\n</span>\n\n\n <p id=\"answer_273825134dcc433abbb012fa5e660d4d_2_1\" class=\"answer answer-annotation\"/>\n</div>\n</div></div>\n <div class=\"solution-span\">\n <span id=\"solution_273825134dcc433abbb012fa5e660d4d_solution_1\"/>\n</div></div>\n <div class=\"action\">\n <input type=\"hidden\" name=\"problem_id\" value=\"Blank Problem\" />\n\n <div class=\"problem-action-buttons-wrapper\">\n <span class=\"problem-action-button-wrapper\">\n <button type=\"button\" class=\"show problem-action-btn btn-link btn-small\" aria-describedby=\"273825134dcc433abbb012fa5e660d4d-problem-title\"><span class=\"show-label\">Show answer</span></button>\n </span>\n </div>\n <div class=\"submit-attempt-container\">\n <button type=\"button\" class=\"submit btn-brand\" data-submitting=\"Submitting\" data-value=\"Submit\" data-should-enable-submit-button=\"True\" aria-describedby=\"submission_feedback_273825134dcc433abbb012fa5e660d4d\" >\n <span class=\"submit-label\">Submit</span>\n </button>\n\n <div class=\"submission-feedback \" id=\"submission_feedback_273825134dcc433abbb012fa5e660d4d\">\n <span class=\"sr\">Some problems have options such as save, reset, hints, or show answer. These options follow the Submit button.</span>\n </div>\n </div>\n </div>\n \n\n\n<div class=\"notification warning notification-gentle-alert\n is-hidden\"\n tabindex=\"-1\">\n <span class=\"icon fa fa-exclamation-circle\" aria-hidden=\"true\"></span>\n <span class=\"notification-message\" aria-describedby=\"273825134dcc433abbb012fa5e660d4d-problem-title\">\n </span>\n <div class=\"notification-btn-wrapper\">\n <button type=\"button\" class=\"btn btn-default btn-small notification-btn review-btn sr\">Review</button>\n </div>\n</div>\n\n \n\n\n<div class=\"notification success notification-submit\n \"\n tabindex=\"-1\">\n <span class=\"icon fa fa-check\" aria-hidden=\"true\"></span>\n <span class=\"notification-message\" aria-describedby=\"273825134dcc433abbb012fa5e660d4d-problem-title\">Correct (2/2 points)\n </span>\n <div class=\"notification-btn-wrapper\">\n <button type=\"button\" class=\"btn btn-default btn-small notification-btn review-btn sr\">Review</button>\n </div>\n</div>\n\n \n\n\n<div class=\"notification warning notification-save\n is-hidden\"\n tabindex=\"-1\">\n <span class=\"icon fa fa-save\" aria-hidden=\"true\"></span>\n <span class=\"notification-message\" aria-describedby=\"273825134dcc433abbb012fa5e660d4d-problem-title\">None\n </span>\n <div class=\"notification-btn-wrapper\">\n <button type=\"button\" class=\"btn btn-default btn-small notification-btn review-btn sr\">Review</button>\n </div>\n</div>\n\n \n \n\n\n<div class=\"notification general notification-show-answer\n is-hidden\"\n tabindex=\"-1\">\n <span class=\"icon fa fa-info-circle\" aria-hidden=\"true\"></span>\n <span class=\"notification-message\" aria-describedby=\"273825134dcc433abbb012fa5e660d4d-problem-title\">Answers are displayed within the problem\n </span>\n <div class=\"notification-btn-wrapper\">\n <button type=\"button\" class=\"btn btn-default btn-small notification-btn review-btn sr\">Review</button>\n </div>\n</div>\n\n</div>\n\n<script>\n function emit_event(message) {\n parent.postMessage(message, '*');\n }\n</script>\n",
"progress_changed": true,
"current_score": 2,
"total_possible": 2,
"attempts_used": 1
} |
Submit answer and annotation
|
Poll offline mode table
Action | Description | Screenshot |
---|---|---|
| Submit student response:
|
Submit student answer
|
|
|
|
|
{
"export_pending": false,
"last_export_result": {
"error": null,
"report_filename": "poll-data-export-2024-05-16-125901.csv",
"start_timestamp": 1715864341.7679486,
"generation_time_s": 0.017258167266845703
},
"download_url": "/media/grades/bc464e2fcc7196b8bee26353b5b3742bd111e17d/poll-data-export-2024-05-16-125901.csv"
} |
Export results to CSV
|
|
|
|
Survey offline mode table.
Action | Description | Screenshot |
---|---|---|
| Submit student answer:
|
Submit answer
|
|
|
|
|
|
|
|
|
|
Done xBlock offline mode table.
Action | Description | Screenshot |
---|---|---|
Complete |
|
|
Word cloud xBlock offline mode table.
Action | Description | Screenshot |
---|---|---|
Save | Press save button Event: student_words%5B%5D=hello&student_words%5B%5D=world&student_words%5B%5D=how+&student_words%5B%5D=are&student_words%5B%5D=you Response: {
"status": "success",
"submitted": true,
"display_student_percents": true,
"student_words": {
"hello": 1,
"world": 1,
"how": 1,
"are": 1,
"you": 1
},
"total_count": 5,
"top_words": [
{
"text": "are",
"size": 1,
"percent": 20
},
{
"text": "hello",
"size": 1,
"percent": 20
},
{
"text": "how",
"size": 1,
"percent": 20
},
{
"text": "world",
"size": 1,
"percent": 20
},
{
"text": "you",
"size": 1,
"percent": 20
}
]
} |
Press save button
|
Recommender xBlock offline mode table.
Action | Description | Screenshot |
---|---|---|
|
|
Show and hide related resources
|
| Press upload resources button
|
|
| Press button Download resources
|
|
| Press button Add new resource
|
|