Skip to content

X
xblock-vectordraw
Commit 224391aa by Tim Krones
Options

Address review comments.

parent d2d0e84d
Showing with 72 additions and 175 deletions
tests/integration/test_vectordraw.py
...@@ -712,10 +712,10 @@ class TestVectorDraw(StudioEditableBaseTest): ...@@ -712,10 +712,10 @@ class TestVectorDraw(StudioEditableBaseTest):
# Board should not show point initially # Board should not show point initially
points = json.loads(params["points"]) points = json.loads(params["points"])
self.check_points(board, points) self.check_points(board, points)
# Add point (need to do this first since point is selected initially)
self.add_point(board, points)
# Add vector # Add vector
self.add_vector(board, vectors) self.add_vector(board, vectors)
# Add point
self.add_point(board, points)
# Reset # Reset
self.reset(board, vectors, points) self.reset(board, vectors, points)
...@@ -1003,3 +1003,7 @@ class TestVectorDraw(StudioEditableBaseTest): ...@@ -1003,3 +1003,7 @@ class TestVectorDraw(StudioEditableBaseTest):
vectors[0]["expected_tail_position"] = {'cx': 347, 'cy': 181} vectors[0]["expected_tail_position"] = {'cx': 347, 'cy': 181}
vectors[0]["expected_tip_position"] = {'cx': 411, 'cy': 117} vectors[0]["expected_tip_position"] = {'cx': 411, 'cy': 117}
self.check_vectors(board, vectors) self.check_vectors(board, vectors)
# Check error message
error_message = self.exercise.find_element_by_css_selector(".update-error");
self.wait_until_visible(error_message)
self.assertEquals(error_message.text, "Invalid input.")
vectordraw/public/css/vectordraw.css
...@@ -26,15 +26,23 @@ ...@@ -26,15 +26,23 @@
width: 100%; width: 100%;
} }
.vectordraw_block .menu,
.vectordraw_block .menu .controls { .vectordraw_block .menu .controls {
border-top-left-radius: 5px; border-top-left-radius: 5px;
border-top-right-radius: 5px; border-top-right-radius: 5px;
background-color: #e0e0e0;
font-size: 0;
}
.vectordraw_block .menu {
border-top: 2px solid #1f628d; border-top: 2px solid #1f628d;
border-left: 2px solid #1f628d; border-left: 2px solid #1f628d;
border-right: 2px solid #1f628d; border-right: 2px solid #1f628d;
}
.vectordraw_block .menu .controls {
border-bottom: 2px solid #1f628d;
padding: 3px; padding: 3px;
background-color: #e0e0e0;
font-size: 0;
} }
.vectordraw_block .menu .controls select { .vectordraw_block .menu .controls select {
...@@ -72,10 +80,6 @@ ...@@ -72,10 +80,6 @@
} }
.vectordraw_block .menu .vector-properties { .vectordraw_block .menu .vector-properties {
border-top: 2px solid #1f628d;
border-left: 2px solid #1f628d;
border-right: 2px solid #1f628d;
border-bottom: 0px none;
padding: 10px; padding: 10px;
font-size: 16px; font-size: 16px;
line-height: 1.25; line-height: 1.25;
...@@ -96,16 +100,7 @@ ...@@ -96,16 +100,7 @@
display: table-row; display: table-row;
} }
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-name, .vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop {
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-tail,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-tail-label,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-length,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-length-label,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-angle,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-angle-label,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-slope,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-slope-label,
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-update {
display: table-cell; display: table-cell;
width: 50% width: 50%
} }
...@@ -116,12 +111,22 @@ ...@@ -116,12 +111,22 @@
padding-right: 5px; padding-right: 5px;
} }
.vectordraw_block .menu .vector-properties .vector-prop-list .row span,
.vectordraw_block .menu .vector-properties .vector-prop-list .row select, .vectordraw_block .menu .vector-properties .vector-prop-list .row select,
.vectordraw_block .menu .vector-properties .vector-prop-list .row input { .vectordraw_block .menu .vector-properties .vector-prop-list .row input {
float: right;
width: 50%; width: 50%;
} }
.vectordraw_block .menu .vector-properties .vector-prop-list .row select,
.vectordraw_block .menu .vector-properties .vector-prop-list .row input {
float: right;
}
.vectordraw_block .menu .vector-properties .vector-prop-list .row .vector-prop-update .update-error {
visibility: hidden;
color: #ff0000;
}
.vectordraw_block .action button { .vectordraw_block .action button {
height: 40px; height: 40px;
margin-right: 10px; margin-right: 10px;
......
vectordraw/public/css/vectordraw_edit.css
...@@ -14,116 +14,13 @@ ...@@ -14,116 +14,13 @@
font-size: 0.9em; font-size: 0.9em;
} }
.vectordraw_edit_block #vectordraw {
margin-bottom: 1.5em;
}
.vectordraw_edit_block .jxgboard { .vectordraw_edit_block .jxgboard {
border: 2px solid #1f628d; float: none;
margin-bottom: 1em; margin-bottom: 1em;
} }
.vectordraw_edit_block .jxgboard .JXGtext {
pointer-events: none; /* prevents cursor from turning into caret when over a label */
}
/* Menu */ /* Menu */
.vectordraw_edit_block .menu {
width: 100%;
}
.vectordraw_edit_block .menu .controls {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-top: 2px solid #1f628d;
border-left: 2px solid #1f628d;
border-right: 2px solid #1f628d;
padding: 3px;
background-color: #e0e0e0;
font-size: 0;
}
.vectordraw_edit_block .menu .controls select {
width: 160px;
margin-right: 3px;
font-size: 18px;
}
.vectordraw_edit_block .menu button {
border: 1px solid #1f628d;
border-radius: 5px;
margin: 4px 0;
padding: 5px 10px 5px 10px;
box-shadow: 0 1px 3px #666;
background-color: #c2e0f4;
color: #1f628d;
font-size: 14px;
text-decoration: none;
}
.vectordraw_edit_block .menu button:hover {
background: #c2e0f4;
background-image: -webkit-linear-gradient(top, #c2e0f4, #add5f0);
background-image: -moz-linear-gradient(top, #c2e0f4, #add5f0);
background-image: -ms-linear-gradient(top, #c2e0f4, #add5f0);
background-image: -o-linear-gradient(top, #c2e0f4, #add5f0);
background-image: linear-gradient(to bottom, #c2e0f4, #add5f0);
text-decoration: none;
}
.vectordraw_edit_block .menu .vector-properties {
border-top: 2px solid #1f628d;
border-left: 2px solid #1f628d;
border-right: 2px solid #1f628d;
border-bottom: 0px none;
padding: 10px;
font-size: 16px;
line-height: 1.25;
background-color: #f7f7f7;
}
.vectordraw_edit_block .menu .vector-properties h3 {
font-size: 16px;
margin: 0 0 5px;
}
.vectordraw_edit_block .menu .vector-properties .vector-prop-list {
display: table;
width: 100%
}
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row {
display: table-row;
}
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-name,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-tail,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-tail-label,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-length,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-length-label,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-angle,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-angle-label,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-slope,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-slope-label,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-update,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-remove {
display: table-cell;
width: 50%
}
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-name,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-tail,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-prop-angle {
padding-right: 5px;
}
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row select,
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row input {
float: right;
width: 50%;
}
.vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-remove { .vectordraw_edit_block .menu .vector-properties .vector-prop-list .row .vector-remove {
vertical-align: bottom; vertical-align: bottom;
} }
......
vectordraw/public/js/vectordraw.js
...@@ -68,8 +68,6 @@ function VectorDrawXBlock(runtime, element, init_args) { ...@@ -68,8 +68,6 @@ function VectorDrawXBlock(runtime, element, init_args) {
} }
} }
var noAddOptionSelected = true;
function renderAndSetMenuOptions(element, idx, type, board) { function renderAndSetMenuOptions(element, idx, type, board) {
if (element.render) { if (element.render) {
if (type === 'point') { if (type === 'point') {
...@@ -82,9 +80,8 @@ function VectorDrawXBlock(runtime, element, init_args) { ...@@ -82,9 +80,8 @@ function VectorDrawXBlock(runtime, element, init_args) {
var addOption = board.getAddMenuOption(type, idx); var addOption = board.getAddMenuOption(type, idx);
addOption.prop('disabled', false); addOption.prop('disabled', false);
// ... and select it if no option is currently selected // ... and select it if no option is currently selected
if (noAddOptionSelected) { if ($('.menu .element-list-add option').filter(':selected').length === 0) {
addOption.prop('selected', true); addOption.prop('selected', true);
noAddOptionSelected = false;
} }
// Disable corresponding option in menu for editing vectors // Disable corresponding option in menu for editing vectors
var editOption = board.getEditMenuOption(type, idx); var editOption = board.getEditMenuOption(type, idx);
...@@ -473,7 +470,7 @@ function VectorDrawXBlock(runtime, element, init_args) { ...@@ -473,7 +470,7 @@ function VectorDrawXBlock(runtime, element, init_args) {
newLength = $('.vector-prop-length input', element).val(), newLength = $('.vector-prop-length input', element).val(),
newAngle = $('.vector-prop-angle input', element).val(); newAngle = $('.vector-prop-angle input', element).val();
// Process values // Process values
newTail = _.map(newTail.split(', '), function(coord) { newTail = _.map(newTail.split(/ *, */), function(coord) {
return parseFloat(coord); return parseFloat(coord);
}); });
newLength = parseFloat(newLength); newLength = parseFloat(newLength);
...@@ -481,6 +478,7 @@ function VectorDrawXBlock(runtime, element, init_args) { ...@@ -481,6 +478,7 @@ function VectorDrawXBlock(runtime, element, init_args) {
var values = [newTail[0], newTail[1], newLength, newAngle]; var values = [newTail[0], newTail[1], newLength, newAngle];
// Validate values // Validate values
if (!_.some(values, Number.isNaN)) { if (!_.some(values, Number.isNaN)) {
$('.vector-prop-update .update-error', element).css('visibility', 'hidden');
// Use coordinates of new tail, new length, new angle to calculate new position of tip // Use coordinates of new tail, new length, new angle to calculate new position of tip
var radians = newAngle * Math.PI / 180; var radians = newAngle * Math.PI / 180;
var newTip = [ var newTip = [
...@@ -492,6 +490,8 @@ function VectorDrawXBlock(runtime, element, init_args) { ...@@ -492,6 +490,8 @@ function VectorDrawXBlock(runtime, element, init_args) {
board_object.point1.setPosition(JXG.COORDS_BY_USER, newTail); board_object.point1.setPosition(JXG.COORDS_BY_USER, newTail);
board_object.point2.setPosition(JXG.COORDS_BY_USER, newTip); board_object.point2.setPosition(JXG.COORDS_BY_USER, newTip);
this.board.update(); this.board.update();
} else {
$('.vector-prop-update .update-error', element).css('visibility', 'visible');
} }
}; };
...@@ -606,31 +606,22 @@ function VectorDrawXBlock(runtime, element, init_args) { ...@@ -606,31 +606,22 @@ function VectorDrawXBlock(runtime, element, init_args) {
.success(updateStatus); .success(updateStatus);
} }
// Logic for dealing with rendering issues
function reRender() {
JXG.JSXGraph.freeBoard(vectordraw.board);
vectordraw.render();
}
// Initialization logic // Initialization logic
// Initialize exercise // Initialize exercise.
var vectordraw = new VectorDraw('vectordraw', init_args.settings); // Defer it so that we don't try to initialize it for a hidden element (in Studio);
// JSXGraph has problems rendering a board if the containing element is hidden.
window.setTimeout(function() {
var vectordraw = new VectorDraw('vectordraw', init_args.settings);
// Check if board was initialized successfully; // Load user state
// if not, re-render the exercise: if (!_.isEmpty(init_args.user_state)) {
if (vectordraw.board.canvasWidth === 0 && vectordraw.board.canvasHeight === 0) { vectordraw.setState(init_args.user_state);
window.setTimeout(reRender, 1); updateStatus(init_args.user_state);
} }
// Load user state
if (!_.isEmpty(init_args.user_state)) {
vectordraw.setState(init_args.user_state);
updateStatus(init_args.user_state);
}
// Set up click handlers // Set up click handlers
$('.action .check', element).on('click', function(e) { checkAnswer(vectordraw); }); $('.action .check', element).on('click', function(e) { checkAnswer(vectordraw); });
}, 0);
} }
vectordraw/public/js/vectordraw_edit.js
...@@ -415,7 +415,7 @@ function VectorDrawXBlockEdit(runtime, element, init_args) { ...@@ -415,7 +415,7 @@ function VectorDrawXBlockEdit(runtime, element, init_args) {
newLength = $('.vector-prop-length input', element).val(), newLength = $('.vector-prop-length input', element).val(),
newAngle = $('.vector-prop-angle input', element).val(); newAngle = $('.vector-prop-angle input', element).val();
// Process values // Process values
newTail = _.map(newTail.split(', '), function(coord) { newTail = _.map(newTail.split(/ *, */), function(coord) {
return parseFloat(coord); return parseFloat(coord);
}); });
newLength = parseFloat(newLength); newLength = parseFloat(newLength);
...@@ -423,6 +423,7 @@ function VectorDrawXBlockEdit(runtime, element, init_args) { ...@@ -423,6 +423,7 @@ function VectorDrawXBlockEdit(runtime, element, init_args) {
var values = [newTail[0], newTail[1], newLength, newAngle]; var values = [newTail[0], newTail[1], newLength, newAngle];
// Validate values // Validate values
if (!_.some(values, Number.isNaN)) { if (!_.some(values, Number.isNaN)) {
$('.vector-prop-update .update-error', element).css('visibility', 'hidden');
// Use coordinates of new tail, new length, new angle to calculate new position of tip // Use coordinates of new tail, new length, new angle to calculate new position of tip
var radians = newAngle * Math.PI / 180; var radians = newAngle * Math.PI / 180;
var newTip = [ var newTip = [
...@@ -434,6 +435,8 @@ function VectorDrawXBlockEdit(runtime, element, init_args) { ...@@ -434,6 +435,8 @@ function VectorDrawXBlockEdit(runtime, element, init_args) {
board_object.point1.setPosition(JXG.COORDS_BY_USER, newTail); board_object.point1.setPosition(JXG.COORDS_BY_USER, newTail);
board_object.point2.setPosition(JXG.COORDS_BY_USER, newTip); board_object.point2.setPosition(JXG.COORDS_BY_USER, newTip);
this.board.update(); this.board.update();
} else {
$('.vector-prop-update .update-error', element).css('visibility', 'visible');
} }
}; };
......
vectordraw/templates/html/vectordraw.html
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
{% endif %} {% endif %}
<div id="vectordraw"> <div id="vectordraw">
<div class="menu" style="width: {{ self.menu_width }}px;"> <div class="menu" style="width: {{ self.width }}px;">
<div class="controls"> <div class="controls">
<span class="sr" id="element-list-add-label">{% trans "Select element to add to board" %}</span> <span class="sr" id="element-list-add-label">{% trans "Select element to add to board" %}</span>
<select class="element-list-add" aria-labelledby="element-list-add-label"> <select class="element-list-add" aria-labelledby="element-list-add-label">
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
<h3>{{ self.vector_properties_label }}</h3> <h3>{{ self.vector_properties_label }}</h3>
<div class="vector-prop-list"> <div class="vector-prop-list">
<div class="row"> <div class="row">
<div class="vector-prop-name"> <div class="vector-prop vector-prop-name">
<span id="vector-prop-name-label"> <span id="vector-prop-name-label">
{% trans "name" %}: {% trans "name" %}:
</span> </span>
...@@ -70,13 +70,13 @@ ...@@ -70,13 +70,13 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="vector-prop-tail"> <div class="vector-prop vector-prop-tail">
<span id="vector-prop-tail-label"> <span id="vector-prop-tail-label">
{% trans "tail position" %}: {% trans "tail position" %}:
</span> </span>
<input type="text" value="-" aria-labelledby="vector-prop-tail-label"> <input type="text" value="-" aria-labelledby="vector-prop-tail-label">
</div> </div>
<div class="vector-prop-length"> <div class="vector-prop vector-prop-length">
<span id="vector-prop-length-label"> <span id="vector-prop-length-label">
{% trans "length" %}: {% trans "length" %}:
</span> </span>
...@@ -84,13 +84,13 @@ ...@@ -84,13 +84,13 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="vector-prop-angle"> <div class="vector-prop vector-prop-angle">
<span id="vector-prop-angle-label"> <span id="vector-prop-angle-label">
{% trans "angle" %}: {% trans "angle" %}:
</span> </span>
<input type="text" value="-" aria-labelledby="vector-prop-angle-label"> <input type="text" value="-" aria-labelledby="vector-prop-angle-label">
</div> </div>
<div class="vector-prop-slope"> <div class="vector-prop vector-prop-slope">
<span id="vector-prop-slope-label"> <span id="vector-prop-slope-label">
{% trans "slope" %}: {% trans "slope" %}:
</span> </span>
...@@ -98,11 +98,12 @@ ...@@ -98,11 +98,12 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="vector-prop-update"> <div class="vector-prop vector-prop-update">
<button class="update"> <button class="update">
<span class="update-label" aria-hidden="true">{% trans "Update" %}</span> <span class="update-label" aria-hidden="true">{% trans "Update" %}</span>
<span class="sr">{% trans "Update properties of selected element" %}</span> <span class="sr">{% trans "Update properties of selected element" %}</span>
</button> </button>
<span class="update-error">{% trans "Invalid input." %}</span>
</div> </div>
</div> </div>
</div> </div>
......
vectordraw/templates/html/vectordraw_edit.html
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
{% endfor %} {% endfor %}
<li> <li>
<!-- WYSIWYG editor --> <!-- WYSIWYG editor -->
<div class="vectordraw_edit_block"> <div class="vectordraw_block vectordraw_edit_block">
<h2 aria-describedby="wysiwyg-description">WYSIWYG Editor</h2> <h2 aria-describedby="wysiwyg-description">WYSIWYG Editor</h2>
<p id="wysiwyg-description"> <p id="wysiwyg-description">
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
</p> </p>
<div id="vectordraw"> <div id="vectordraw">
<div class="menu" style="width: {{ self.menu_width }}px;"> <div class="menu" style="width: {{ self.width }}px;">
<div class="controls"> <div class="controls">
<button class="add-vector">{% trans "Create vector" %}</button> <button class="add-vector">{% trans "Create vector" %}</button>
</div> </div>
...@@ -99,7 +99,7 @@ ...@@ -99,7 +99,7 @@
<h3>{{ self.vector_properties_label }}</h3> <h3>{{ self.vector_properties_label }}</h3>
<div class="vector-prop-list"> <div class="vector-prop-list">
<div class="row"> <div class="row">
<div class="vector-prop-name"> <div class="vector-prop vector-prop-name">
<span id="vector-prop-name-label"> <span id="vector-prop-name-label">
{% trans "name" %}: {% trans "name" %}:
</span> </span>
...@@ -114,13 +114,13 @@ ...@@ -114,13 +114,13 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="vector-prop-tail"> <div class="vector-prop vector-prop-tail">
<span id="vector-prop-tail-label"> <span id="vector-prop-tail-label">
{% trans "tail position" %}: {% trans "tail position" %}:
</span> </span>
<input type="text" value="-" aria-labelledby="vector-prop-tail-label"> <input type="text" value="-" aria-labelledby="vector-prop-tail-label">
</div> </div>
<div class="vector-prop-length"> <div class="vector-prop vector-prop-length">
<span id="vector-prop-length-label"> <span id="vector-prop-length-label">
{% trans "length" %}: {% trans "length" %}:
</span> </span>
...@@ -128,13 +128,13 @@ ...@@ -128,13 +128,13 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="vector-prop-angle"> <div class="vector-prop vector-prop-angle">
<span id="vector-prop-angle-label"> <span id="vector-prop-angle-label">
{% trans "angle" %}: {% trans "angle" %}:
</span> </span>
<input type="text" value="-" aria-labelledby="vector-prop-angle-label"> <input type="text" value="-" aria-labelledby="vector-prop-angle-label">
</div> </div>
<div class="vector-prop-slope"> <div class="vector-prop vector-prop-slope">
<span id="vector-prop-slope-label"> <span id="vector-prop-slope-label">
{% trans "slope" %}: {% trans "slope" %}:
</span> </span>
...@@ -142,13 +142,14 @@ ...@@ -142,13 +142,14 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="vector-prop-update"> <div class="vector-prop vector-prop-update">
<button class="update"> <button class="update">
<span class="update-label" aria-hidden="true">{% trans "Update" %}</span> <span class="update-label" aria-hidden="true">{% trans "Update" %}</span>
<span class="sr">{% trans "Update properties of selected element" %}</span> <span class="sr">{% trans "Update properties of selected element" %}</span>
</button> </button>
<span class="update-error">{% trans "Invalid input." %}</span>
</div> </div>
<div class="vector-remove"> <div class="vector-prop vector-remove">
<button class="remove"> <button class="remove">
<span class="remove-label" aria-hidden="true">{% trans "Remove" %}</span> <span class="remove-label" aria-hidden="true">{% trans "Remove" %}</span>
<span class="sr">{% trans "Remove selected element" %}</span> <span class="sr">{% trans "Remove selected element" %}</span>
......
vectordraw/vectordraw.py
...@@ -264,14 +264,6 @@ class VectorDrawXBlock(StudioEditableXBlockMixin, XBlock): ...@@ -264,14 +264,6 @@ class VectorDrawXBlock(StudioEditableXBlockMixin, XBlock):
} }
@property @property
def menu_width(self):
"""
Width of SVG canvas (controlled by JSXGraph) consistently ends up being 4px larger
than self.width. Adjust menu size accordingly to ensure that board and menu line up.
"""
return self.width + 4
@property
def user_state(self): def user_state(self):
""" """
Return user state, which is a combination of most recent answer and result. Return user state, which is a combination of most recent answer and result.
...@@ -426,6 +418,9 @@ class VectorDrawXBlock(StudioEditableXBlockMixin, XBlock): ...@@ -426,6 +418,9 @@ class VectorDrawXBlock(StudioEditableXBlockMixin, XBlock):
fragment.add_content(loader.render_template("templates/html/vectordraw_edit.html", context)) fragment.add_content(loader.render_template("templates/html/vectordraw_edit.html", context))
# Add resources to studio_view fragment # Add resources to studio_view fragment
fragment.add_css_url( fragment.add_css_url(
self.runtime.local_resource_url(self, 'public/css/vectordraw.css')
)
fragment.add_css_url(
self.runtime.local_resource_url(self, 'public/css/vectordraw_edit.css') self.runtime.local_resource_url(self, 'public/css/vectordraw_edit.css')
) )
fragment.add_javascript_url( fragment.add_javascript_url(
......
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