feat: character image in short answer XBlock

ai_eval/shortanswer.py

@@ -30,6 +30,15 @@ class ShortAnswerAIEvalXBlock(AIEvalXBlock):
         scope=Scope.settings,
     )
 
+    character_image = String(
+        display_name=_("Character Image URL"),
+        help=_(
+            "URL for an image to be shown to the left of the chat box; "
+            "leave empty to disable"
+        ),
+        scope=Scope.settings,
+    )
+
     max_responses = Integer(
         display_name=_("Max Responses"),
         help=_("The maximum number of response messages the student can submit"),
@@ -47,6 +56,7 @@ class ShortAnswerAIEvalXBlock(AIEvalXBlock):
     editable_fields = AIEvalXBlock.editable_fields + (
         "max_responses",
         "allow_reset",
+        "character_image",
     )
 
     def validate_field_data(self, validation, data):

ai_eval/static/css/shortanswer.css

@@ -1,5 +1,15 @@
 /* CSS for ShortAnswerAIEvalXBlock */
 
+.shortanswer_image {
+  float: left;
+  margin-right: 4rem;
+  width: 30%;
+}
+
+.shortanswer_image > img {
+  max-width: 100%;
+}
+
 .shortanswer_block .count {
   font-weight: bold;
 }

ai_eval/templates/shortanswer.html

@@ -1,3 +1,9 @@
+{% if self.character_image %}
+    <div class="shortanswer_image">
+        <img src="{{ self.character_image }}" />
+    </div>
+{% endif %}
+
 <div class="shortanswer_block">
     <div>
         <div id="question-text">

ai_eval/tests/test_ai_eval.py

@@ -85,3 +85,13 @@ def test_reset_forbidden(self):
         with self.assertRaises(JsonHandlerError):
             block.reset.__wrapped__(block, data={})
         self.assertEqual(block.messages, {"USER": ["Hello"], "LLM": ["Hello"]})
+
+    def test_character_image(self):
+        """Test the character image."""
+        data = {
+            **self.data,
+            "character_image": "/static/image.jpg",
+        }
+        block = ShortAnswerAIEvalXBlock(ToyRuntime(), DictFieldData(data), None)
+        frag = block.student_view()
+        self.assertIn('<img src="/static/image.jpg" />', frag.content)