Fix #3347: "Run Code" reloads page in Matlab Problem
Instead of refreshing only the necessary parts, "Run Code" reloads the whole page. This commit fixes this behaviour, by refreshing the specific elements belonging to the Problem instead. Also tidies up indentation.
This commit is contained in:
@@ -39,7 +39,7 @@
|
||||
<div class="external-grader-message" aria-live="polite">
|
||||
${msg|n}
|
||||
</div>
|
||||
<div class="external-grader-message" aria-live="polite">
|
||||
<div class="external-grader-message ungraded-matlab-result" aria-live="polite">
|
||||
${queue_msg|n}
|
||||
</div>
|
||||
|
||||
@@ -55,13 +55,11 @@
|
||||
if($(parent_elt).find('.capa_alert').length) {
|
||||
$(parent_elt).find('.capa_alert').remove();
|
||||
}
|
||||
var alert_elem = "<div>" + msg + "</div>";
|
||||
alert_elem = $(alert_elem).addClass('capa_alert');
|
||||
var alert_elem = $("<div>" + msg + "</div>");
|
||||
alert_elem.addClass('capa_alert').addClass('is-fading-in');
|
||||
$(parent_elt).find('.action').after(alert_elem);
|
||||
$(parent_elt).find('.capa_alert').css({opacity: 0}).animate({opacity: 1}, 700);
|
||||
}
|
||||
|
||||
|
||||
// hook up the plot button
|
||||
var plot = function(event) {
|
||||
var problem_elt = $(event.target).closest('.problems-wrapper');
|
||||
@@ -72,7 +70,7 @@
|
||||
// since there could be multiple codemirror instances on the page,
|
||||
// save all of them.
|
||||
$('.CodeMirror').each(function(i, el){
|
||||
el.CodeMirror.save();
|
||||
el.CodeMirror.save();
|
||||
});
|
||||
var input = $("#input_${id}");
|
||||
|
||||
@@ -81,33 +79,39 @@
|
||||
|
||||
answer = input.serialize();
|
||||
|
||||
// setup callback for after we send information to plot
|
||||
// a chain of callbacks, each querying the server on success of the previous one
|
||||
|
||||
var get_callback = function(response) {
|
||||
var new_result_elem = $(response.html).find(".ungraded-matlab-result");
|
||||
new_result_elem.addClass("is-fading-in");
|
||||
result_elem = $(problem_elt).find(".ungraded-matlab-result");
|
||||
result_elem.replaceWith(new_result_elem);
|
||||
console.log(response.html);
|
||||
}
|
||||
|
||||
var plot_callback = function(response) {
|
||||
if(response.success) {
|
||||
window.location.reload();
|
||||
$.postWithPrefix(url + "/problem_get", get_callback);
|
||||
} else {
|
||||
gentle_alert(problem_elt, response.message);
|
||||
}
|
||||
}
|
||||
|
||||
var save_callback = function(response) {
|
||||
if(response.success) {
|
||||
// send information to the problem's plot functionality
|
||||
Problem.inputAjax(url, input_id, 'plot',
|
||||
{'submission': submission}, plot_callback);
|
||||
}
|
||||
else {
|
||||
gentle_alert(problem_elt, response.message);
|
||||
}
|
||||
}
|
||||
|
||||
var save_callback = function(response) {
|
||||
if(response.success) {
|
||||
// send information to the problem's plot functionality
|
||||
Problem.inputAjax(url, input_id, 'plot',
|
||||
{'submission': submission}, plot_callback);
|
||||
}
|
||||
else {
|
||||
gentle_alert(problem_elt, response.message);
|
||||
}
|
||||
}
|
||||
|
||||
// save the answer
|
||||
$.postWithPrefix(url + '/problem_save', answer, save_callback);
|
||||
|
||||
}
|
||||
$('#plot_${id}').click(plot);
|
||||
|
||||
});
|
||||
</script>
|
||||
</section>
|
||||
|
||||
@@ -241,3 +241,23 @@
|
||||
@-webkit-keyframes video-appear { @include video-appear-keyframes; }
|
||||
@-moz-keyframes video-appear { @include video-appear-keyframes; }
|
||||
@keyframes video-appear { @include video-appear-keyframes; }
|
||||
|
||||
// quick fade-in animation to get user attention
|
||||
//************************************************************************//
|
||||
|
||||
.is-fading-in {
|
||||
@include animation(fade-in-animation 0.8s);
|
||||
}
|
||||
|
||||
@mixin fade-in-keyframes {
|
||||
0% {
|
||||
opacity: 0.0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fade-in-animation{ @include fade-in-keyframes; }
|
||||
@-moz-keyframes fade-in-animation{ @include fade-in-keyframes; }
|
||||
@keyframes fade-in-animation{ @include fade-in-keyframes; }
|
||||
|
||||
Reference in New Issue
Block a user