Skip to content

E
edx-ora2
Commit f23e41e0 by gradyward
Options

Rendering with real data

parent ea3e49e0
Showing with 143 additions and 65 deletions
openassessment/templates/openassessmentblock/edit/oa_edit_example_based_assessment_tab.html
......@@ -2,65 +2,103 @@
{% spaceless %}
<div id="oa_ai_editor_wrapper" class="oa_editor_content_wrapper">
<div id="openassessment_ai_editor_instructions">
<p>
Fill in the examples below. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est.
</p>
</div>
<div id="openassessment_ai_editor_normal_editing">
<div id="openassessment_ai_editor_instructions">
<p>
Fill in the examples below. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est. Lorem ipsum dolce decorum est.
</p>
</div>
<div id="openassessment_ai_editor_selector_and_editor">
<div id="openassessment_ai_editor_selector_and_editor">
<div id="openassessment_ai_selector_wrapper">
<div id="openassessment_ai_selector_wrapper">
<div id="openassessment_ai_selector_header">
<div id="openassessment_ai_editor_upload_buttons">
<div id="openassessment_ai_editor_upload_csv" class="openassessment_ai_editor_upload_button">
Upload CSV
<div id="openassessment_ai_selector_header">
<div id="openassessment_ai_editor_upload_buttons">
<div id="openassessment_ai_editor_upload_csv" class="openassessment_ai_editor_upload_button">
Upload CSV
</div>
<div id="openassessment_ai_editor_upload_xml" class="openassessment_ai_editor_upload_button">
Upload XML
</div>
</div>
<div id="openassessment_ai_editor_upload_xml" class="openassessment_ai_editor_upload_button">
Upload XML
<div id="openassessment_ai_selector_title">
<h2>Examples</h2>
</div>
</div>
<div id="openassessment_ai_selector_title">
<h2>Examples</h2>
<ol id="openassessment_ai_example_selector">
{% for example in assessments.ai.examples %}
<li class="openassessment_ai_example_selector_item">
<h2 class="openassessment_ai_example_selector_name">{{ example.name }}</h2>
<div class="openassessment_ai_example_remove_button">
<h2>Remove</h2>
</div>
</li>
{% endfor %}
</ol>
<div id="openassessment_ai_selector_add_example">
Add Example
</div>
</div>
<ol id="openassessment_ai_example_selector">
{% for i in "xxxxxxxxxx" %}
<li class="openassessment_ai_example_selector_item">
<h2>Example Name</h2>
<div class="openassessment_ai_example_remove_button">
<h2>Remove</h2>
</div>
</li>
{% endfor %}
</ol>
<div id="openassessment_ai_selector_add_example">
Add Example
<div id="openassessment_ai_example_editor">
<ol id="openassessment_ai_examples">
{% for example in assessments.ai.examples %}
<li class="openassessment_ai_example">
<div class="openassessment_ai_example_settings">
<label class="openassessment_ai_example_label_field">
Example Name
<input type="text" value="{{ example.name }}">
</label>
<h2 class="openassessment_ai_example_total_score">Total Score: 26 / 30</h2>
</div>
<div class="openassessment_ai_example_essay_wrapper">
<textarea class="openassessment_ai_example_essay">{{ example.answer }}</textarea>
</div>
<div class="openassessment_ai_example_scored_rubric">
{% for criterion in example.criteria %}
<div class="openassessment_ai_example_scored_rubric_criterion">
<label> {{ criterion.label }}
<select value="{{ criterion.option_selected }}" data-criterion="{{ criterion.name }}">
{% for option in criterion.options %}
<option data-criterion="{{ criterion.name }}" value="{{ option.name }}"
{% if option.name == criterion.option_selected %} selected {% endif %}>
{{ option.label }} - {{ option.points }} points
</option>
{% endfor %}
</select>
</label>
</div>
{% endfor %}
</div>
</li>
{% endfor %}
</ol>
</div>
</div>
</div>
<div id="openassessment_ai_editor_import_sub_modal" class="is--hidden">
<div id="openassessment_ai_editor_sub_modal_header">
<div id="openassessment_ai_example_editor">
<div class="openassessment_ai_example_settings">
<label class="openassessment_ai_example_label_field">
Example Label
<input type="text">
</label>
<h2 class="openassessment_ai_example_total_score">Total Score: 26 / 30</h2>
</div>
<div class="openassessment_ai_example_essay_wrapper">
<textarea class="openassessment_ai_example_essay"></textarea>
</div>
<div id="openassessment_ai_editor_sub_modal_instructions">
</div>
<div id="openassessment_ai_editor_sub_modal_file_upload">
</div>
<div id="openassessment_ai_editor_sub_modal_file_status">
</div>
<div id="openassessment_ai_editor_sub_modal_buttons">
<div id="openassessment_ai_editor_sub_modal_save">
Save
</div>
<div class="openassessment_ai_example_scored_rubric">
<div class="openassessment_ai_example_scored_rubric_criterion">
<label> Criterion Name
<select>
<option></option>
</select>
</label>
</div>
<div id="openassessment_ai_editor_sub_modal_cancel">
Cancel
</div>
</div>
</div>
......
openassessment/xblock/static/css/openassessment.css
This source diff could not be displayed because it is too large. You can view the blob instead.
openassessment/xblock/static/sass/oa/utilities/_developer.scss
......@@ -207,7 +207,7 @@
.editor_tabs {
width: 45%;
min-width: 190px;
max-width: 360px;
max-width: 450px;
float: right;
.oa_editor_tab {
......@@ -1204,6 +1204,7 @@
width: Calc(50% - 10px);
text-align: center;
border: 1px solid;
cursor: pointer;
}
.openassessment_ai_editor_upload_button:hover{
......@@ -1236,6 +1237,10 @@
font-size: 80%;
text-align: center;
padding: 5px;
border-bottom: 1px solid $edx-gray-l3;
h2{
padding-top: 1px;
}
}
}
......@@ -1256,13 +1261,15 @@
margin: 5px;
text-align: center;
border-radius: 3px;
cursor: pointer;
font-size: 95%;
}
#openassessment_ai_selector_add_example:before{
font-family: FontAwesome;
content: "\f067";
display: inline-block;
margin: 0 5px;
font-size: 90%;
}
#openassessment_ai_selector_add_example:hover {
......@@ -1277,11 +1284,12 @@
overflow-x: scroll;
border-bottom: 1px solid $edx-gray-l3;
h2 {
.openassessment_ai_example_selector_name {
display: inline-block;
text-transform: uppercase;
float: left;
padding: 5px;
font-size: 90%;
}
.openassessment_ai_example_remove_button{
......@@ -1292,11 +1300,14 @@
font-size: 80%;
background-color: white;
float: right;
cursor: pointer;
h2{
display: inline-block;
text-transform: uppercase;
float: left;
padding: 0 4px 0 0;
cursor: pointer;
font-size: 90%;
}
}
......@@ -1317,13 +1328,23 @@
#openassessment_ai_example_editor{
width: Calc(100% - 250px);
padding: 5px;
overflow-y: scroll;
height: 100%;
display: inline-block;
position: absolute;
right: 0;
#openassessment_ai_examples{
height: 100%;
width: 100%;
overflow: hidden;
.openassessment_ai_example{
height: 100%;
width: 100%;
padding: 7.5px;
}
}
.openassessment_ai_example_settings{
width: 100%;
display: inline-block;
......@@ -1341,7 +1362,7 @@
}
.openassessment_ai_example_essay_wrapper{
width: 100%;
height: Calc(100% - 100px);
height: Calc(100% - 102px);
textarea{
width: 100%;
......@@ -1360,21 +1381,29 @@
}
.openassessment_ai_example_scored_rubric{
width: 50%;
width: 100%;
display: inline-block;
label{
padding: 5px;
width: 100%;
display: block;
select{
min-width: 100px;
float: right;
font-size: 14px;
padding: 10px;
width: 45%;
border-radius: 3px;
border: 1px solid #B2B2B2;
text-overflow: ellipsis;
height: 66px;
overflow-y: scroll;
.openassessment_ai_example_scored_rubric_criterion{
width: 50%;
display: inline-block;
label{
padding: 5px 5px 5px 20px;
width: 100%;
display: block;
select{
min-width: 100px;
margin-left: 15%;
font-size: 14px;
padding: 10px;
width: 55%;
border-radius: 3px;
border: 1px solid #B2B2B2;
text-overflow: ellipsis;
}
}
}
}
......
openassessment/xblock/studio_mixin.py
......@@ -279,6 +279,17 @@ class StudioMixin(object):
'criteria': criteria_list,
})
assessments['training'] = {'examples': example_list, 'template': student_training_template}
# Mocking this step out to allow template rendering:
ai_examples = copy.deepcopy(example_list)
count = 1
for example in ai_examples:
example['name'] = "AI Example " + str(count)
count += 1
assessments['ai'] = {'examples': ai_examples, 'template': student_training_template}
# If we don't have student training enabled, we still need to render a single (empty, or default) example
else:
assessments['training'] = {'examples': [student_training_template], 'template': student_training_template}
......
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