Skip to content

E
edx-ora2
Unverified Commit f58e4537 by Brandon DeRosier
Options

Added LaTeX preview feature to all comment/feedback fields

parent 93e0ca47
Showing with 58 additions and 32 deletions
openassessment/templates/openassessmentblock/oa_latex_preview.html 0 → 100644
{% spaceless %}
{% load i18n %}
{% if allow_latex %}
<{{ elem }} class="list--actions__item">
<button type="submit" class="submission__preview action action--save" aria-describedby="response__preview_explanation__{{ id }}" data-input="{{ preview_name }}"
{{submit_enabled|yesno:",disabled" }}>
{% trans "Preview in LaTeX"%}
</button>
<div id="response__preview_explanation__{{ id }}" class="response__submission__label">
{% trans "Click to preview your submission in LaTeX."%}
</div>
</{{ elem }}>
<{{ elem }} class="submission__preview__item list--actions__item">
<article class="submission__answer__display">
<h5 class="submission__answer__display__title">{% trans "Preview Response"%}</h5>
<div class="submission__answer__display__content">
<p class="preview_content" data-preview="{{ preview_name }}"></p>
</div>
</article>
</{{ elem }}>
{% endif %}
{% endspaceless %}
\ No newline at end of file
openassessment/templates/openassessmentblock/oa_rubric.html
...@@ -48,12 +48,14 @@ ...@@ -48,12 +48,14 @@
class="answer__value" class="answer__value"
id="{{ rubric_type }}__assessment__rubric__question--{{ criterion.order_num }}__feedback__{{ xblock_id }}" id="{{ rubric_type }}__assessment__rubric__question--{{ criterion.order_num }}__feedback__{{ xblock_id }}"
value="{{ criterion.name }}" value="{{ criterion.name }}"
data-preview="criteria__{{ criterion.name }}"
data-criterion-name="{{ criterion.name }}" data-criterion-name="{{ criterion.name }}"
aria-describedby="{{ rubric_type }}__assessment__rubric__prompt--{{ criterion.order_num }}" aria-describedby="{{ rubric_type }}__assessment__rubric__prompt--{{ criterion.order_num }}"
maxlength="1000" maxlength="1000"
{% if criterion.feedback == 'required' %}required{% endif %} {% if criterion.feedback == 'required' %}required{% endif %}
> >
</textarea> </textarea>
{% include "openassessmentblock/oa_latex_preview.html" with id="criteria__"|add:rubric_type|add:submission.uuid|add:criterion.order_num elem="div" preview_name="criteria__"|add:criterion.name submit_enabled=True %}
</div> </div>
</div> </div>
</div> </div>
...@@ -70,10 +72,12 @@ ...@@ -70,10 +72,12 @@
<textarea <textarea
class="assessment__rubric__question--feedback__value" class="assessment__rubric__question--feedback__value"
id="{{ rubric_type }}__assessment__rubric__question--feedback__value__{{ xblock_id }}" id="{{ rubric_type }}__assessment__rubric__question--feedback__value__{{ xblock_id }}"
data-preview="feedback"
placeholder="{{ rubric_feedback_default_text }}" placeholder="{{ rubric_feedback_default_text }}"
maxlength="1000" maxlength="1000"
> >
</textarea> </textarea>
{% include "openassessmentblock/oa_latex_preview.html" with id="feedback__"|add:rubric_type|add:submission.uuid elem="div" preview_name="feedback" submit_enabled=True %}
</div> </div>
</li> </li>
</ol> </ol>
......
openassessment/templates/openassessmentblock/response/oa_response.html
...@@ -87,6 +87,7 @@ ...@@ -87,6 +87,7 @@
<textarea <textarea
id="submission__answer__part__text__{{ forloop.counter }}__{{ xblock_id }}" id="submission__answer__part__text__{{ forloop.counter }}__{{ xblock_id }}"
class="submission__answer__part__text__value" class="submission__answer__part__text__value"
data-preview="submission"
aria-labelledby="submission__answer__part__text__title__{{ forloop.counter }}__{{ xblock_id }}" aria-labelledby="submission__answer__part__text__title__{{ forloop.counter }}__{{ xblock_id }}"
aria-describedby="submission__answer__tip__{{ xblock_id }}" aria-describedby="submission__answer__tip__{{ xblock_id }}"
placeholder="{% trans "Enter your response to the question above." %}" placeholder="{% trans "Enter your response to the question above." %}"
...@@ -115,25 +116,7 @@ ...@@ -115,25 +116,7 @@
{{ save_status }} {{ save_status }}
</div> </div>
</li> </li>
{% if allow_latex %} {% include "openassessmentblock/oa_latex_preview.html" with id="submission__"|add:xblock_id elem="li" preview_name="submission" %}
<li class="list--actions__item">
<button type="submit" class="submission__preview action action--save" aria-describedby="response__preview_explanation__{{ xblock_id }}"
{{submit_enabled|yesno:",disabled" }}>
{% trans "Preview in LaTeX"%}
</button>
<div id="response__preview_explanation__{{ xblock_id }}" class="response__submission__label">
{% trans "Click to preview your submission in LaTeX."%}
</div>
</li>
<li class="submission__preview__item list--actions__item">
<article class="submission__answer__display">
<h5 class="submission__answer__display__title">{% trans "Preview Response"%}</h5>
<div class="submission__answer__display__content">
<p class="preview_content"></p>
</div>
</article>
</li>
{% endif %}
</ul> </ul>
</div> </div>
</li> </li>
......
openassessment/xblock/static/js/openassessment-lms.min.js
This source diff could not be displayed because it is too large. You can view the blob instead.
openassessment/xblock/static/js/openassessment-studio.min.js
This source diff could not be displayed because it is too large. You can view the blob instead.
openassessment/xblock/static/js/src/lms/oa_base.js
...@@ -194,6 +194,28 @@ OpenAssessment.BaseView.prototype = { ...@@ -194,6 +194,28 @@ OpenAssessment.BaseView.prototype = {
}, },
/** /**
*Install click handler for the LaTeX preview button.
*
* @param {element} parentElement JQuery selector for the container element.
*/
bindLatexPreview: function(parentElement) {
parentElement.find('.submission__preview').click(
function(eventObject) {
eventObject.preventDefault();
var previewName = $(eventObject.target).data("input");
// extract typed-in response and replace newline with br
var previewText = parentElement.find('textarea[data-preview="' + previewName + '"]').val();
var previewContainer = parentElement.find('.preview_content[data-preview="' + previewName + '"]');
previewContainer.html(previewText.replace(/\r\n|\r|\n/g,"<br />"));
// Render in mathjax
parentElement.find('.submission__preview__item').show();
MathJax.Hub.Queue(['Typeset', MathJax.Hub, previewContainer[0]]);
}
);
},
/**
* Get usage key of an XBlock. * Get usage key of an XBlock.
*/ */
getUsageID: function() { getUsageID: function() {
......
openassessment/xblock/static/js/src/lms/oa_peer.js
...@@ -115,6 +115,9 @@ OpenAssessment.PeerView.prototype = { ...@@ -115,6 +115,9 @@ OpenAssessment.PeerView.prototype = {
// Install a click handler for collapse/expand // Install a click handler for collapse/expand
this.baseView.setUpCollapseExpand(sel); this.baseView.setUpCollapseExpand(sel);
// Install click handler for the preview button
this.baseView.bindLatexPreview(sel);
// Initialize the rubric // Initialize the rubric
var rubricSelector = $(".peer-assessment--001__assessment", this.element); var rubricSelector = $(".peer-assessment--001__assessment", this.element);
if (rubricSelector.size() > 0) { if (rubricSelector.size() > 0) {
......
openassessment/xblock/static/js/src/lms/oa_response.js
...@@ -118,19 +118,7 @@ OpenAssessment.ResponseView.prototype = { ...@@ -118,19 +118,7 @@ OpenAssessment.ResponseView.prototype = {
); );
// Install click handler for the preview button // Install click handler for the preview button
sel.find('.submission__preview').click( this.baseView.bindLatexPreview(sel);
function(eventObject) {
eventObject.preventDefault();
// extract typed-in response and replace newline with br
var previewText = sel.find('.submission__answer__part__text__value').val();
var previewContainer = sel.find('.preview_content');
previewContainer.html(previewText.replace(/\r\n|\r|\n/g,"<br />"));
// Render in mathjax
sel.find('.submission__preview__item').show();
MathJax.Hub.Queue(['Typeset', MathJax.Hub, previewContainer[0]]);
}
);
// Install a click handler for the save button // Install a click handler for the save button
sel.find('.file__upload').click( sel.find('.file__upload').click(
......
openassessment/xblock/static/js/src/lms/oa_self.js
...@@ -58,6 +58,9 @@ OpenAssessment.SelfView.prototype = { ...@@ -58,6 +58,9 @@ OpenAssessment.SelfView.prototype = {
// Install a click handler for collapse/expand // Install a click handler for collapse/expand
this.baseView.setUpCollapseExpand(sel); this.baseView.setUpCollapseExpand(sel);
// Install click handler for the preview button
this.baseView.bindLatexPreview(sel);
// Initialize the rubric // Initialize the rubric
var rubricSelector = $(".self-assessment--001__assessment", this.element); var rubricSelector = $(".self-assessment--001__assessment", this.element);
if (rubricSelector.size() > 0) { if (rubricSelector.size() > 0) {
......
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