Skip to content

X
xblock-drag-and-drop-v2
Commit 8469ed60 by Tim Krones
Options

Address review comments.

parent fb6b6e73
Showing with 65 additions and 92 deletions
drag_and_drop_v2/default_data.py
from .utils import _
INCORRECT_FEEDBACK = _("No, this item does not belong here. Try again.")
CORRECT_FEEDBACK = _("Correct! This one belongs to {zone}.")
TARGET_IMG_DESCRIPTION = _(
"An isosceles triangle with three layers of similar height. "
"It is shown upright, so the widest layer is located at the bottom, "
"and the narrowest layer is located at the top."
)
TOP_ZONE_TITLE = _("The Top Zone")
MIDDLE_ZONE_TITLE = _("The Middle Zone")
BOTTOM_ZONE_TITLE = _("The Bottom Zone")
TOP_ZONE_DESCRIPTION = _("Use this zone to associate an item with the top layer of the triangle.")
MIDDLE_ZONE_DESCRIPTION = _("Use this zone to associate an item with the middle layer of the triangle.")
BOTTOM_ZONE_DESCRIPTION = _("Use this zone to associate an item with the bottom layer of the triangle.")
ITEM_INCORRECT_FEEDBACK = _("No, this item does not belong here. Try again.")
ITEM_CORRECT_FEEDBACK = _("Correct! This one belongs to {zone}.")
START_FEEDBACK = _("Drag the items onto the image above.")
FINISH_FEEDBACK = _("Good work! You have completed this drag and drop exercise.")
DEFAULT_DATA = {
"targetImgDescription": TARGET_IMG_DESCRIPTION,
"zones": [
{
"index": 1,
"id": "zone-1",
"title": _("The Top Zone"),
"title": TOP_ZONE_TITLE,
"description": TOP_ZONE_DESCRIPTION,
"x": 160,
"y": 30,
"width": 196,
......@@ -17,7 +36,8 @@ DEFAULT_DATA = {
{
"index": 2,
"id": "zone-2",
"title": _("The Middle Zone"),
"title": MIDDLE_ZONE_TITLE,
"description": MIDDLE_ZONE_DESCRIPTION,
"x": 86,
"y": 210,
"width": 340,
......@@ -26,7 +46,8 @@ DEFAULT_DATA = {
{
"index": 3,
"id": "zone-3",
"title": _("The Bottom Zone"),
"title": BOTTOM_ZONE_TITLE,
"description": BOTTOM_ZONE_DESCRIPTION,
"x": 15,
"y": 350,
"width": 485,
......@@ -35,37 +56,37 @@ DEFAULT_DATA = {
],
"items": [
{
"displayName": "Goes to the top",
"displayName": _("Goes to the top"),
"feedback": {
"incorrect": INCORRECT_FEEDBACK,
"correct": CORRECT_FEEDBACK.format(zone="the top")
"incorrect": ITEM_INCORRECT_FEEDBACK,
"correct": ITEM_CORRECT_FEEDBACK.format(zone=TOP_ZONE_TITLE)
},
"zone": "The Top Zone",
"zone": TOP_ZONE_TITLE,
"imageURL": "",
"id": 0,
},
{
"displayName": "Goes to the middle",
"displayName": _("Goes to the middle"),
"feedback": {
"incorrect": INCORRECT_FEEDBACK,
"correct": CORRECT_FEEDBACK.format(zone="the middle")
"incorrect": ITEM_INCORRECT_FEEDBACK,
"correct": ITEM_CORRECT_FEEDBACK.format(zone=MIDDLE_ZONE_TITLE)
},
"zone": "The Middle Zone",
"zone": MIDDLE_ZONE_TITLE,
"imageURL": "",
"id": 1,
},
{
"displayName": "Goes to the bottom",
"displayName": _("Goes to the bottom"),
"feedback": {
"incorrect": INCORRECT_FEEDBACK,
"correct": CORRECT_FEEDBACK.format(zone="the bottom")
"incorrect": ITEM_INCORRECT_FEEDBACK,
"correct": ITEM_CORRECT_FEEDBACK.format(zone=BOTTOM_ZONE_TITLE)
},
"zone": "The Bottom Zone",
"zone": BOTTOM_ZONE_TITLE,
"imageURL": "",
"id": 2,
},
{
"displayName": "I don't belong anywhere",
"displayName": _("I don't belong anywhere"),
"feedback": {
"incorrect": _("You silly, there are no zones for this one."),
"correct": ""
......@@ -76,7 +97,7 @@ DEFAULT_DATA = {
},
],
"feedback": {
"start": _("Drag the items onto the image above."),
"finish": _("Good work! You have completed this drag and drop exercise.")
"start": START_FEEDBACK,
"finish": FINISH_FEEDBACK,
},
}
drag_and_drop_v2/drag_and_drop_v2.py
......@@ -144,20 +144,11 @@ class DragAndDropBlock(XBlock):
item['inputOptions'] = 'inputOptions' in item
return items
def title_with_points():
"""
Build title using `display_name` and `weight` of this Drag and Drop exercise.
"""
if self.weight == 1:
return "{title} (1 point possible)".format(title=self.display_name)
else:
return "{title} ({max_grade} points possible)".format(title=self.display_name, max_grade=self.weight)
return {
"zones": self.data.get('zones', []),
"display_zone_labels": self.data.get('displayLabels', False),
"items": items_without_answers(),
"title": title_with_points(),
"title": self.display_name,
"show_title": self.show_title,
"question_text": self.question_text,
"show_question_header": self.show_question_header,
......
drag_and_drop_v2/public/css/drag_and_drop_edit.css
......@@ -203,15 +203,8 @@
.xblock--drag-and-drop--editor .items-form .item-numerical-value,
.xblock--drag-and-drop--editor .items-form .item-numerical-margin {
margin-right: 1%;
}
.xblock--drag-and-drop--editor .items-form .item-numerical-value {
width: 620px;
}
.xblock--drag-and-drop--editor .items-form .item-numerical-margin {
width: 578px;
margin: 0 1%;
width: 50%;
}
.xblock--drag-and-drop--editor .items-form textarea {
......
drag_and_drop_v2/templates/html/drag_and_drop_edit.html
......@@ -20,7 +20,7 @@
</label>
<h3>{% trans "Maximum score" %}</h3>
<input class="weight" value="1" value="{{ self.weight }}" />
<input type="number" step="0.1" class="weight" value="1" value="{{ self.weight }}" />
<h3>{% trans "Question text" %}</h3>
<textarea class="question-text">{{ self.question_text }}</textarea>
......@@ -51,7 +51,7 @@
<input type="text"
class="url-input"
aria-labelledby="background-url-label"
placeholder="e.g. http://example.com/background.png or /static/background.png">
placeholder="{% trans 'e.g. http://example.com/background.png or /static/background.png' %}">
<h3 id="background-description-label">
{% trans "Background description" %}
</h3>
......
drag_and_drop_v2/templates/html/js_templates.html
......@@ -123,7 +123,7 @@
</div>
<div class="row">
<label for="item-{{id}}-numerical-margin">
{{i18n "Margin ± (to be considered correct, value entered by user must not differ from expected value by more than this)"}}
{{i18n "Margin ± (when a numerical value is required, values entered by students must not differ from the expected value by more than this margin; default is zero)"}}
</label>
<input type="number"
step="0.1"
......
tests/integration/test_interaction.py
from selenium.webdriver import ActionChains
from drag_and_drop_v2.default_data import START_FEEDBACK, FINISH_FEEDBACK
from .test_base import BaseIntegrationTest
from ..utils import load_resource
......@@ -161,8 +162,8 @@ class BasicInteractionTest(InteractionTestBase):
all_zones = ['Zone 1', 'Zone 2']
feedback = {
"intro": "Drag the items onto the image above.",
"final": "Good work! You have completed this drag and drop exercise."
"intro": START_FEEDBACK,
"final": FINISH_FEEDBACK,
}
def _get_scenario_xml(self): # pylint: disable=no-self-use
......
tests/integration/test_render.py
from ddt import ddt, unpack, data
from selenium.common.exceptions import NoSuchElementException
from drag_and_drop_v2.default_data import START_FEEDBACK
from ..utils import load_resource
from .test_base import BaseIntegrationTest
......@@ -184,7 +185,7 @@ class TestDragAndDropRender(BaseIntegrationTest):
feedback = self._get_feedback()
feedback_message = self._get_feedback_message()
self.assertEqual(feedback.get_attribute('aria-live'), 'polite')
self.assertEqual(feedback_message.text, "Drag the items onto the image above.")
self.assertEqual(feedback_message.text, START_FEEDBACK)
def test_background_image(self):
self.load_scenario()
......
tests/integration/test_title_and_question.py
......@@ -53,8 +53,7 @@ class TestDragAndDropTitleAndQuestion(BaseIntegrationTest):
page = self.go_to_page(const_page_name)
if show_title:
problem_header = page.find_element_by_css_selector('h2.problem-header')
expected_header = display_name + ' (1 point possible)'
self.assertEqual(self.get_element_html(problem_header), expected_header)
self.assertEqual(self.get_element_html(problem_header), display_name)
else:
with self.assertRaises(NoSuchElementException):
page.find_element_by_css_selector('h2.problem-header')
tests/unit/data/html/config_out.json
{
"title": "DnDv2 XBlock with HTML instructions (1 point possible)",
"title": "DnDv2 XBlock with HTML instructions",
"show_title": false,
"question_text": "Solve this <strong>drag-and-drop</strong> problem.",
"show_question_header": false,
......
tests/unit/data/old/config_out.json
{
"title": "Drag and Drop (1 point possible)",
"title": "Drag and Drop",
"show_title": true,
"question_text": "",
"show_question_header": true,
......
tests/unit/data/plain/config_out.json
{
"title": "DnDv2 XBlock with plain text instructions (1 point possible)",
"title": "DnDv2 XBlock with plain text instructions",
"show_title": true,
"question_text": "Can you solve this drag-and-drop problem?",
"show_question_header": true,
......
tests/unit/test_basics.py
import unittest
from ..utils import (
DEFAULT_START_FEEDBACK,
DEFAULT_FINISH_FEEDBACK,
make_block,
TestCaseMixin,
from drag_and_drop_v2.default_data import (
TARGET_IMG_DESCRIPTION, START_FEEDBACK, FINISH_FEEDBACK, DEFAULT_DATA
)
from ..utils import make_block, TestCaseMixin
class BasicTests(TestCaseMixin, unittest.TestCase):
......@@ -31,45 +29,17 @@ class BasicTests(TestCaseMixin, unittest.TestCase):
items = config.pop("items")
self.assertEqual(config, {
"display_zone_labels": False,
"title": "Drag and Drop (1 point possible)",
"title": "Drag and Drop",
"show_title": True,
"question_text": "",
"show_question_header": True,
"target_img_expanded_url": '/expanded/url/to/drag_and_drop_v2/public/img/triangle.png',
"target_img_description": "",
"target_img_description": TARGET_IMG_DESCRIPTION,
"item_background_color": None,
"item_text_color": None,
"initial_feedback": DEFAULT_START_FEEDBACK,
"initial_feedback": START_FEEDBACK,
})
self.assertEqual(zones, [
{
"index": 1,
"id": "zone-1",
"title": "The Top Zone",
"x": 160,
"y": 30,
"width": 196,
"height": 178,
},
{
"index": 2,
"id": "zone-2",
"title": "The Middle Zone",
"x": 86,
"y": 210,
"width": 340,
"height": 138,
},
{
"index": 3,
"id": "zone-3",
"title": "The Bottom Zone",
"x": 15,
"y": 350,
"width": 485,
"height": 135,
}
])
self.assertEqual(zones, DEFAULT_DATA["zones"])
# Items should contain no answer data:
self.assertEqual(items, [
{"id": 0, "displayName": "Goes to the top", "imageURL": "", "inputOptions": False},
......@@ -87,7 +57,7 @@ class BasicTests(TestCaseMixin, unittest.TestCase):
self.assertEqual(self.call_handler("get_user_state"), {
'items': {},
'finished': False,
'overall_feedback': DEFAULT_START_FEEDBACK,
'overall_feedback': START_FEEDBACK,
})
assert_user_state_empty()
......@@ -113,7 +83,7 @@ class BasicTests(TestCaseMixin, unittest.TestCase):
'2': {'x_percent': '99%', 'y_percent': '95%', 'correct_input': True},
},
'finished': True,
'overall_feedback': DEFAULT_FINISH_FEEDBACK,
'overall_feedback': FINISH_FEEDBACK,
})
# Reset to initial conditions
......
tests/utils.py
......@@ -10,9 +10,6 @@ from xblock.runtime import KvsFieldData, DictKeyValueStore
import drag_and_drop_v2
DEFAULT_START_FEEDBACK = "Drag the items onto the image above."
DEFAULT_FINISH_FEEDBACK = "Good work! You have completed this drag and drop exercise."
def make_request(data, method='POST'):
""" Make a webob JSON Request """
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment