merged qa into codeocean
This commit is contained in:
@ -13,8 +13,8 @@ $(function() {
|
|||||||
var THEME = 'ace/theme/textmate';
|
var THEME = 'ace/theme/textmate';
|
||||||
|
|
||||||
var editors = [];
|
var editors = [];
|
||||||
var active_file;
|
var active_file = undefined;
|
||||||
var active_frame;
|
var active_frame = undefined;
|
||||||
var running = false;
|
var running = false;
|
||||||
|
|
||||||
var flowrResultHtml = '<div class="panel panel-default"><div id="{{headingId}}" role="tab" class="panel-heading"><h4 class="panel-title"><a data-toggle="collapse" data-parent="#flowrHint" href="#{{collapseId}}" aria-expanded="true" aria-controls="{{collapseId}}"></a></h4></div><div id="{{collapseId}}" role="tabpanel" aria-labelledby="{{headingId}}" class="panel-collapse collapse"><div class="panel-body"></div></div></div>'
|
var flowrResultHtml = '<div class="panel panel-default"><div id="{{headingId}}" role="tab" class="panel-heading"><h4 class="panel-title"><a data-toggle="collapse" data-parent="#flowrHint" href="#{{collapseId}}" aria-expanded="true" aria-controls="{{collapseId}}"></a></h4></div><div id="{{collapseId}}" role="tabpanel" aria-labelledby="{{headingId}}" class="panel-collapse collapse"><div class="panel-body"></div></div></div>'
|
||||||
@ -128,9 +128,22 @@ $(function() {
|
|||||||
|
|
||||||
var evaluateCodeWithStreamedResponse = function(url, callback) {
|
var evaluateCodeWithStreamedResponse = function(url, callback) {
|
||||||
var event_source = new EventSource(url);
|
var event_source = new EventSource(url);
|
||||||
|
event_source.addEventListener('close', function(event) {
|
||||||
|
event_source.close();
|
||||||
|
hideSpinner();
|
||||||
|
running = false;
|
||||||
|
toggleButtonStates();
|
||||||
|
if (JSON.parse(event.data).code !== 200) {
|
||||||
|
ajaxError();
|
||||||
|
showTab(1);
|
||||||
|
}
|
||||||
|
|
||||||
event_source.addEventListener('close', closeEventSource);
|
if (qa_api) {
|
||||||
event_source.addEventListener('error', closeEventSource);
|
qa_api.executeCommand('syncOutput', [chunkBuffer]);
|
||||||
|
chunkBuffer = [{streamedResponse: true}];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
event_source.addEventListener('error', ajaxError);
|
||||||
event_source.addEventListener('hint', renderHint);
|
event_source.addEventListener('hint', renderHint);
|
||||||
event_source.addEventListener('info', storeContainerInformation);
|
event_source.addEventListener('info', storeContainerInformation);
|
||||||
event_source.addEventListener('output', callback);
|
event_source.addEventListener('output', callback);
|
||||||
@ -264,6 +277,9 @@ $(function() {
|
|||||||
var handleTestResponse = function(response) {
|
var handleTestResponse = function(response) {
|
||||||
clearOutput();
|
clearOutput();
|
||||||
printOutput(response[0], false, 0);
|
printOutput(response[0], false, 0);
|
||||||
|
if (qa_api) {
|
||||||
|
qa_api.executeCommand('syncOutput', [response]);
|
||||||
|
}
|
||||||
showStatus(response[0]);
|
showStatus(response[0]);
|
||||||
showTab(2);
|
showTab(2);
|
||||||
};
|
};
|
||||||
@ -276,6 +292,19 @@ $(function() {
|
|||||||
var initializeEditors = function() {
|
var initializeEditors = function() {
|
||||||
$('.editor').each(function(index, element) {
|
$('.editor').each(function(index, element) {
|
||||||
var editor = ace.edit(element);
|
var editor = ace.edit(element);
|
||||||
|
if (qa_api) {
|
||||||
|
editor.getSession().on("change", function (deltaObject) {
|
||||||
|
qa_api.executeCommand('syncEditor', [active_file, deltaObject]);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
var document = editor.getSession().getDocument();
|
||||||
|
// insert pre-existing code into editor. we have to use insertLines, otherwise the deltas are not properly added
|
||||||
|
var file_id = $(element).data('file-id');
|
||||||
|
var content = $('.editor-content[data-file-id=' + file_id + ']');
|
||||||
|
setActiveFile($(element).parent().data('filename'), file_id);
|
||||||
|
|
||||||
|
document.insertLines(0, content.text().split(/\n/));
|
||||||
editor.setReadOnly($(element).data('read-only') !== undefined);
|
editor.setReadOnly($(element).data('read-only') !== undefined);
|
||||||
editor.setShowPrintMargin(false);
|
editor.setShowPrintMargin(false);
|
||||||
editor.setTheme(THEME);
|
editor.setTheme(THEME);
|
||||||
@ -500,10 +529,15 @@ $(function() {
|
|||||||
return 'executable' in active_frame.data();
|
return 'executable' in active_frame.data();
|
||||||
};
|
};
|
||||||
|
|
||||||
var isActiveFileRenderable = function() {
|
var setActiveFile = function (filename, fileId) {
|
||||||
return 'renderable' in active_frame.data();
|
active_file = {
|
||||||
};
|
filename: filename,
|
||||||
|
id: fileId
|
||||||
|
};
|
||||||
|
}
|
||||||
|
var isActiveFileRenderable = function() {
|
||||||
|
return 'renderable' in active_frame.data();
|
||||||
|
};
|
||||||
var isActiveFileRunnable = function() {
|
var isActiveFileRunnable = function() {
|
||||||
return isActiveFileExecutable() && ['main_file', 'user_defined_file'].includes(active_frame.data('role'));
|
return isActiveFileExecutable() && ['main_file', 'user_defined_file'].includes(active_frame.data('role'));
|
||||||
};
|
};
|
||||||
@ -532,10 +566,17 @@ $(function() {
|
|||||||
panel.find('.row .col-sm-9').eq(3).find('a').attr('href', '#output-' + index);
|
panel.find('.row .col-sm-9').eq(3).find('a').attr('href', '#output-' + index);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var chunkBuffer = [{streamedResponse: true}];
|
||||||
|
|
||||||
var printChunk = function(event) {
|
var printChunk = function(event) {
|
||||||
var output = JSON.parse(event.data);
|
var output = JSON.parse(event.data);
|
||||||
if (output) {
|
if (output) {
|
||||||
printOutput(output, true, 0);
|
printOutput(output, true, 0);
|
||||||
|
// send test response to QA
|
||||||
|
// we are expecting an array of outputs:
|
||||||
|
if (qa_api) {
|
||||||
|
chunkBuffer.push(output);
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
clearOutput();
|
clearOutput();
|
||||||
$('#hint').fadeOut();
|
$('#hint').fadeOut();
|
||||||
@ -575,6 +616,10 @@ $(function() {
|
|||||||
printOutput(result, false, index);
|
printOutput(result, false, index);
|
||||||
printScoringResult(result, index);
|
printScoringResult(result, index);
|
||||||
});
|
});
|
||||||
|
if (qa_api) {
|
||||||
|
// send test response to QA
|
||||||
|
qa_api.executeCommand('syncOutput', [response]);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var renderCode = function(event) {
|
var renderCode = function(event) {
|
||||||
@ -698,10 +743,7 @@ $(function() {
|
|||||||
var showFirstFile = function() {
|
var showFirstFile = function() {
|
||||||
var frame = $('.frame[data-role="main_file"]').isPresent() ? $('.frame[data-role="main_file"]') : $('.frame').first();
|
var frame = $('.frame[data-role="main_file"]').isPresent() ? $('.frame[data-role="main_file"]') : $('.frame').first();
|
||||||
var file_id = frame.find('.editor').data('file-id');
|
var file_id = frame.find('.editor').data('file-id');
|
||||||
active_file = {
|
setActiveFile(frame.data('filename'), file_id);
|
||||||
filename: frame.data('filename'),
|
|
||||||
id: file_id
|
|
||||||
};
|
|
||||||
$('#files').jstree().select_node(file_id);
|
$('#files').jstree().select_node(file_id);
|
||||||
showFrame(frame);
|
showFrame(frame);
|
||||||
toggleButtonStates();
|
toggleButtonStates();
|
||||||
@ -834,18 +876,52 @@ $(function() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
if ($('#editor').isPresent()) {
|
if ($('#editor').isPresent()) {
|
||||||
if (isBrowserSupported()) {
|
var qa_api;
|
||||||
$('.score, #development-environment').show();
|
if ($('#questions-column').isPresent() && QaApi.isBrowserSupported()) {
|
||||||
configureEditors();
|
$('#editor-column').addClass('col-md-8').removeClass('col-md-10');
|
||||||
initializeEditors();
|
$('#questions-column').addClass('col-md-3');
|
||||||
initializeEventHandlers();
|
|
||||||
initializeFileTree();
|
var node = document.getElementById('questions-holder');
|
||||||
initializeTooltips();
|
var url = $('#questions-holder').data('url');
|
||||||
renderScore();
|
|
||||||
showFirstFile();
|
var qa_api = new QaApi(node, url);
|
||||||
showRequestedTab();
|
|
||||||
} else {
|
|
||||||
$('#alert').show();
|
|
||||||
}
|
}
|
||||||
|
configureEditors();
|
||||||
|
initializeEditors(qa_api);
|
||||||
|
initializeEventHandlers();
|
||||||
|
initializeFileTree();
|
||||||
|
initializeTooltips();
|
||||||
|
renderScore();
|
||||||
|
showMainFile();
|
||||||
|
showRequestedTab();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var stderrOutput = ''
|
||||||
|
var handleStderrOutputForFlowr = function(event) {
|
||||||
|
var json = JSON.parse(event.data);
|
||||||
|
|
||||||
|
if (json.stderr) {
|
||||||
|
stderrOutput += json.stderr;
|
||||||
|
} else if (json.code) {
|
||||||
|
var flowrHintBody = $('#flowrHint .panel-body')
|
||||||
|
|
||||||
|
jQuery.getJSON(flowrUrl + '&query=' + escape(stderrOutput), function(data) {
|
||||||
|
for (var question in data.queryResults) {
|
||||||
|
// replace everything, not only one occurence
|
||||||
|
var collapsibleTileHtml = flowrResultHtml.replace(/{{collapseId}}/g, 'collapse-' + question).replace(/{{headingId}}/g, 'heading-' + question)
|
||||||
|
var resultTile = $(collapsibleTileHtml)
|
||||||
|
|
||||||
|
resultTile.find('h4 > a').text(data.queryResults[question].title)
|
||||||
|
resultTile.find('.panel-body').append($(data.queryResults[question].body))
|
||||||
|
|
||||||
|
flowrHintBody.append(resultTile)
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#flowrHint').fadeIn()
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
stderrOutput = ''
|
||||||
|
}
|
||||||
|
};
|
||||||
});
|
});
|
||||||
|
@ -2,4 +2,17 @@ module ExerciseHelper
|
|||||||
def embedding_parameters(exercise)
|
def embedding_parameters(exercise)
|
||||||
"locale=#{I18n.locale}&token=#{exercise.token}"
|
"locale=#{I18n.locale}&token=#{exercise.token}"
|
||||||
end
|
end
|
||||||
|
|
||||||
|
def qa_js_tag
|
||||||
|
javascript_include_tag qa_url + "/assets/qa_api.js"
|
||||||
|
end
|
||||||
|
|
||||||
|
def qa_url
|
||||||
|
config = CodeOcean::Config.new(:code_ocean)
|
||||||
|
enabled = config.read[:code_pilot][:enabled]
|
||||||
|
|
||||||
|
if enabled
|
||||||
|
config.read[:code_pilot][:url]
|
||||||
|
end
|
||||||
|
end
|
||||||
end
|
end
|
||||||
|
@ -1,73 +1,79 @@
|
|||||||
h1 = @exercise
|
.row
|
||||||
|
#editor-column.col-md-10.col-md-offset-1
|
||||||
|
h1 = @exercise
|
||||||
|
|
||||||
span.badge.pull-right.score
|
span.badge.pull-right.score
|
||||||
|
|
||||||
p.lead = @exercise.description
|
p.lead = @exercise.description
|
||||||
|
|
||||||
#alert.alert.alert-danger role='alert'
|
#alert.alert.alert-danger role='alert'
|
||||||
h4 = t('.alert.title')
|
h4 = t('.alert.title')
|
||||||
p = t('.alert.text', application_name: application_name)
|
p = t('.alert.text', application_name: application_name)
|
||||||
|
|
||||||
#development-environment
|
#development-environment
|
||||||
ul.nav.nav-justified.nav-tabs role='tablist'
|
ul.nav.nav-justified.nav-tabs role='tablist'
|
||||||
li.active
|
li.active
|
||||||
a data-placement='top' data-toggle='tab' data-tooltip=true href='#instructions' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 1')
|
a data-placement='top' data-toggle='tab' data-tooltip=true href='#instructions' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 1')
|
||||||
i.fa.fa-question
|
i.fa.fa-question
|
||||||
= t('activerecord.attributes.exercise.instructions')
|
= t('activerecord.attributes.exercise.instructions')
|
||||||
li
|
li
|
||||||
a data-placement='top' data-toggle='tab' data-tooltip=true href='#workspace' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 2')
|
a data-placement='top' data-toggle='tab' data-tooltip=true href='#workspace' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 2')
|
||||||
i.fa.fa-code
|
i.fa.fa-code
|
||||||
= t('.workspace')
|
= t('.workspace')
|
||||||
li
|
li
|
||||||
a data-placement='top' data-toggle='tab' data-tooltip=true href='#outputInformation' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 3')
|
a data-placement='top' data-toggle='tab' data-tooltip=true href='#outputInformation' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 3')
|
||||||
i.fa.fa-terminal
|
i.fa.fa-terminal
|
||||||
= t('.output')
|
= t('.output')
|
||||||
li
|
li
|
||||||
a data-placement='top' data-toggle='tab' data-tooltip=true href='#progress' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 4')
|
a data-placement='top' data-toggle='tab' data-tooltip=true href='#progress' role='tab' title=t('shared.tooltips.shortcut', shortcut: 'ALT + 4')
|
||||||
i.fa.fa-line-chart
|
i.fa.fa-line-chart
|
||||||
= t('.progress')
|
= t('.progress')
|
||||||
|
|
||||||
hr
|
hr
|
||||||
|
|
||||||
.tab-content
|
.tab-content
|
||||||
#instructions.tab-pane.active
|
#instructions.tab-pane.active
|
||||||
p = render_markdown(@exercise.instructions)
|
p = render_markdown(@exercise.instructions)
|
||||||
br
|
br
|
||||||
p.text-center
|
p.text-center
|
||||||
a#start.btn.btn-lg.btn-success
|
a#start.btn.btn-lg.btn-success
|
||||||
i.fa.fa-code
|
i.fa.fa-code
|
||||||
= t('.start')
|
= t('.start')
|
||||||
#workspace.tab-pane = render('editor', exercise: @exercise, files: @files, submission: @submission)
|
#workspace.tab-pane = render('editor', exercise: @exercise, files: @files, submission: @submission)
|
||||||
#outputInformation.tab-pane data-message-no-output=t('.no_output')
|
#outputInformation.tab-pane data-message-no-output=t('.no_output')
|
||||||
#hint
|
#hint
|
||||||
.panel.panel-warning
|
.panel.panel-warning
|
||||||
.panel-heading = t('.hint')
|
.panel-heading = t('.hint')
|
||||||
.panel-body
|
.panel-body
|
||||||
#output
|
#output
|
||||||
pre = t('.no_output_yet')
|
pre = t('.no_output_yet')
|
||||||
- if CodeOcean::Config.new(:code_ocean).read[:flowr][:enabled]
|
- if CodeOcean::Config.new(:code_ocean).read[:flowr][:enabled]
|
||||||
#flowrHint.panel.panel-info data-url=CodeOcean::Config.new(:code_ocean).read[:flowr][:url] role='tab'
|
#flowrHint.panel.panel-info data-url=CodeOcean::Config.new(:code_ocean).read[:flowr][:url] role='tab'
|
||||||
.panel-heading = 'Gain more insights here'
|
.panel-heading = 'Gain more insights here'
|
||||||
.panel-body
|
.panel-body
|
||||||
#progress.tab-pane
|
#progress.tab-pane
|
||||||
#results
|
#results
|
||||||
h2 = t('.results')
|
h2 = t('.results')
|
||||||
p.test-count == t('.test_count', count: 0)
|
p.test-count == t('.test_count', count: 0)
|
||||||
ul.list-unstyled
|
ul.list-unstyled
|
||||||
ul#dummies.hidden.list-unstyled
|
ul#dummies.hidden.list-unstyled
|
||||||
li.panel.panel-default
|
li.panel.panel-default
|
||||||
.panel-heading
|
.panel-heading
|
||||||
h3.panel-title == t('.file', filename: '', number: 0)
|
h3.panel-title == t('.file', filename: '', number: 0)
|
||||||
.panel-body
|
.panel-body
|
||||||
= row(label: '.passed_tests', value: t('shared.out_of', maximum_value: 0, value: 0).html_safe)
|
= row(label: '.passed_tests', value: t('shared.out_of', maximum_value: 0, value: 0).html_safe)
|
||||||
= row(label: 'activerecord.attributes.submission.score', value: t('shared.out_of', maximum_value: 0, value: 0).html_safe)
|
= row(label: 'activerecord.attributes.submission.score', value: t('shared.out_of', maximum_value: 0, value: 0).html_safe)
|
||||||
= row(label: '.feedback')
|
= row(label: '.feedback')
|
||||||
= row(label: '.output', value: link_to(t('shared.show'), '#'))
|
= row(label: '.output', value: link_to(t('shared.show'), '#'))
|
||||||
#score data-maximum-score=@exercise.maximum_score data-score=@submission.try(:score)
|
#score data-maximum-score=@exercise.maximum_score data-score=@submission.try(:score)
|
||||||
h4
|
h4
|
||||||
span == "#{t('activerecord.attributes.submission.score')}: "
|
span == "#{t('activerecord.attributes.submission.score')}: "
|
||||||
span.score
|
span.score
|
||||||
.progress
|
.progress
|
||||||
.progress-bar role='progressbar'
|
.progress-bar role='progressbar'
|
||||||
br
|
br
|
||||||
p.text-center = render('editor_button', classes: 'btn-lg btn-success', data: {:'data-message-confirm' => t('exercises.editor.confirm_submit'), :'data-url' => submit_exercise_path(@exercise)}, icon: 'fa fa-send', id: 'submit', label: t('exercises.editor.submit'))
|
p.text-center = render('editor_button', classes: 'btn-lg btn-success', data: {:'data-message-confirm' => t('exercises.editor.confirm_submit'), :'data-url' => submit_exercise_path(@exercise)}, icon: 'fa fa-send', id: 'submit', label: t('exercises.editor.submit'))
|
||||||
|
- if qa_url
|
||||||
|
#questions-column
|
||||||
|
#questions-holder data-url="#{qa_url}/qa/index/#{@exercise.id}/#{@user_id}"
|
||||||
|
= qa_js_tag
|
@ -1,11 +1,16 @@
|
|||||||
default: &default
|
default: &default
|
||||||
flowr:
|
flowr:
|
||||||
enabled: false
|
enabled: false
|
||||||
|
code_pilot:
|
||||||
|
enabled: false
|
||||||
|
|
||||||
development:
|
development:
|
||||||
flowr:
|
flowr:
|
||||||
enabled: true
|
enabled: true
|
||||||
url: http://example.org:3000/api/exceptioninfo?id=&lang=auto
|
url: http://example.org:3000/api/exceptioninfo?id=&lang=auto
|
||||||
|
code_pilot:
|
||||||
|
enabled: true
|
||||||
|
url: //localhost:3000
|
||||||
|
|
||||||
production:
|
production:
|
||||||
<<: *default
|
<<: *default
|
||||||
|
@ -1,3 +1,5 @@
|
|||||||
test:
|
test:
|
||||||
flowr:
|
flowr:
|
||||||
enabled: false
|
enabled: false
|
||||||
|
code_pilot:
|
||||||
|
enabled: false
|
Reference in New Issue
Block a user