htwkmooc/codeocean
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add more actions to show exercise

Browse Source
This commit is contained in:
Sebastian Serth
2020-05-05 15:34:17 +02:00
parent d4a3c78b95
commit d07b4f436e
2 changed files with 381 additions and 367 deletions
Download Patch File Download Diff File Expand all files Collapse all files

128
app/assets/javascripts/exercises.js.erb
View File

@ -1,4 +1,4 @@
$(document).on('turbolinks:load', function() { $(document).on('turbolinks:load', function () {
// ruby part adds the relative_url_root, if it is set. // ruby part adds the relative_url_root, if it is set.
var ACE_FILES_PATH = '<%= (defined? Rails.application.config.relative_url_root) && Rails.application.config.relative_url_root != nil && Rails.application.config.relative_url_root != "" ? Rails.application.config.relative_url_root : "" %>' + '/assets/ace/'; var ACE_FILES_PATH = '<%= (defined? Rails.application.config.relative_url_root) && Rails.application.config.relative_url_root != nil && Rails.application.config.relative_url_root != "" ? Rails.application.config.relative_url_root : "" %>' + '/assets/ace/';
var THEME = 'ace/theme/textmate'; var THEME = 'ace/theme/textmate';
@ -9,14 +9,13 @@ $(document).on('turbolinks:load', function() {
var file_types; var file_types;
var configureEditors = function () {
var configureEditors = function() { _.each(['modePath', 'themePath', 'workerPath'], function (attribute) {
_.each(['modePath', 'themePath', 'workerPath'], function(attribute) {
ace.config.set(attribute, ACE_FILES_PATH); ace.config.set(attribute, ACE_FILES_PATH);
}); });
}; };
var initializeEditor = function(index, element) { var initializeEditor = function (index, element) {
var editor = ace.edit(element); var editor = ace.edit(element);
var document = editor.getSession().getDocument(); var document = editor.getSession().getDocument();
@ -31,13 +30,12 @@ $(document).on('turbolinks:load', function() {
editor.setShowPrintMargin(false); editor.setShowPrintMargin(false);
editor.setTheme(THEME); editor.setTheme(THEME);
var textarea = $('textarea[id="exercise_files_attributes_'+index+'_content"]'); var textarea = $('textarea[id="exercise_files_attributes_' + index + '_content"]');
var content = textarea.val(); var content = textarea.val();
if (content != undefined) if (content != undefined) {
{
editor.getSession().setValue(content); editor.getSession().setValue(content);
editor.getSession().on('change', function(){ editor.getSession().on('change', function () {
textarea.val(editor.getSession().getValue()); textarea.val(editor.getSession().getValue());
}); });
} }
@ -50,13 +48,13 @@ $(document).on('turbolinks:load', function() {
session.setUseWrapMode(true); session.setUseWrapMode(true);
} }
var initializeEditors = function() { var initializeEditors = function () {
// initialize ace editors for all code textareas in the dom except the last one. The last one is the dummy area for new files, which is cloned when needed. // initialize ace editors for all code textareas in the dom except the last one. The last one is the dummy area for new files, which is cloned when needed.
// this one must NOT! be initialized. // this one must NOT! be initialized.
$('.editor:not(:last)').each(initializeEditor) $('.editor:not(:last)').each(initializeEditor)
}; };
var addFileForm = function(event) { var addFileForm = function (event) {
event.preventDefault(); event.preventDefault();
var element = $('#dummies').children().first().clone(); var element = $('#dummies').children().first().clone();
@ -74,7 +72,7 @@ $(document).on('turbolinks:load', function() {
initializeEditor(latestTextAreaIndex, $('#files .editor').last()[0]); initializeEditor(latestTextAreaIndex, $('#files .editor').last()[0]);
}; };
var removeFileForm = function(fileUrl) { var removeFileForm = function (fileUrl) {
// validate fileUrl // validate fileUrl
var matches = fileUrl.match(/files\/(\d+)/); var matches = fileUrl.match(/files\/(\d+)/);
if (matches) { if (matches) {
@ -89,7 +87,7 @@ $(document).on('turbolinks:load', function() {
} }
} }
var deleteFile = function(event) { var deleteFile = function (event) {
event.preventDefault(); event.preventDefault();
var fileUrl = $(event.target).data('file-url'); var fileUrl = $(event.target).data('file-url');
@ -108,21 +106,21 @@ $(document).on('turbolinks:load', function() {
} }
} }
var ajaxError = function(error) { var ajaxError = function (error) {
$.flash.danger({ $.flash.danger({
text: $('#flash').data('message-failure') text: $('#flash').data('message-failure')
}); });
Sentry.captureException(JSON.stringify(error)); Sentry.captureException(JSON.stringify(error));
}; };
var buildCheckboxes = function() { var buildCheckboxes = function () {
$('tbody tr').each(function(index, element) { $('tbody tr').each(function (index, element) {
var td = $('td.public', element); var td = $('td.public', element);
var checkbox = $('<input>', { var checkbox = $('<input>', {
checked: td.data('value'), checked: td.data('value'),
type: 'checkbox' type: 'checkbox'
}); });
td.on('click', function(event) { td.on('click', function (event) {
event.preventDefault(); event.preventDefault();
checkbox.prop('checked', !checkbox.prop('checked')); checkbox.prop('checked', !checkbox.prop('checked'));
}); });
@ -130,13 +128,13 @@ $(document).on('turbolinks:load', function() {
}); });
}; };
var discardFile = function(event) { var discardFile = function (event) {
event.preventDefault(); event.preventDefault();
$(this).parents('li').remove(); $(this).parents('li').remove();
}; };
var enableBatchUpdate = function() { var enableBatchUpdate = function () {
$('thead .batch a').on('click', function(event) { $('thead .batch a').on('click', function (event) {
event.preventDefault(); event.preventDefault();
if (!$(event.target).data('toggled')) { if (!$(event.target).data('toggled')) {
$(event.target).data('toggled', true); $(event.target).data('toggled', true);
@ -148,35 +146,35 @@ $(document).on('turbolinks:load', function() {
}); });
}; };
var enableInlineFileCreation = function() { var enableInlineFileCreation = function () {
$('#add-file').on('click', addFileForm); $('#add-file').on('click', addFileForm);
$('#files').on('click', 'li .discard-file', discardFile); $('#files').on('click', 'li .discard-file', discardFile);
$('form.edit_exercise, form.new_exercise').on('submit', function() { $('form.edit_exercise, form.new_exercise').on('submit', function () {
$('#dummies').html(''); $('#dummies').html('');
}); });
$('.delete-file').on('click', deleteFile); $('.delete-file').on('click', deleteFile);
}; };
var findFileTypeByFileExtension = function(file_extension) { var findFileTypeByFileExtension = function (file_extension) {
return _.find(file_types, function(file_type) { return _.find(file_types, function (file_type) {
return file_type.file_extension === file_extension; return file_type.file_extension === file_extension;
}) || {}; }) || {};
}; };
var getSelectedExecutionEnvironment = function() { var getSelectedExecutionEnvironment = function () {
return _.find(execution_environments, function(execution_environment) { return _.find(execution_environments, function (execution_environment) {
return execution_environment.id === parseInt($('#exercise_execution_environment_id').val()); return execution_environment.id === parseInt($('#exercise_execution_environment_id').val());
}) || {}; }) || {};
}; };
var highlightCode = function() { var highlightCode = function () {
$('pre code').each(function(index, element) { $('pre code').each(function (index, element) {
hljs.highlightBlock(element); hljs.highlightBlock(element);
}); });
}; };
var inferFileAttributes = function() { var inferFileAttributes = function () {
$(document).on('change', 'input[type="file"]', function() { $(document).on('change', 'input[type="file"]', function () {
var filename = $(this).val().split(/\\|\//g).pop(); var filename = $(this).val().split(/\\|\//g).pop();
var file_extension = '.' + filename.split('.')[1]; var file_extension = '.' + filename.split('.')[1];
var file_type = findFileTypeByFileExtension(file_extension); var file_type = findFileTypeByFileExtension(file_extension);
@ -187,7 +185,7 @@ $(document).on('turbolinks:load', function() {
}); });
}; };
var insertTabAtCursor = function(textarea) { var insertTabAtCursor = function (textarea) {
var selection_start = textarea.get(0).selectionStart; var selection_start = textarea.get(0).selectionStart;
var selection_end = textarea.get(0).selectionEnd; var selection_end = textarea.get(0).selectionEnd;
textarea.val(textarea.val().substring(0, selection_start) + "\t" + textarea.val().substring(selection_end)); textarea.val(textarea.val().substring(0, selection_start) + "\t" + textarea.val().substring(selection_end));
@ -195,8 +193,8 @@ $(document).on('turbolinks:load', function() {
textarea.get(0).selectionEnd = selection_start + 1; textarea.get(0).selectionEnd = selection_start + 1;
}; };
var observeFileRoleChanges = function() { var observeFileRoleChanges = function () {
$(document).on('change', 'select[name$="[role]"]', function() { $(document).on('change', 'select[name$="[role]"]', function () {
var is_test_file = $(this).val() === 'teacher_defined_test'; var is_test_file = $(this).val() === 'teacher_defined_test';
var parent = $(this).parents('.card'); var parent = $(this).parents('.card');
var fields = parent.find('.test-related-fields'); var fields = parent.find('.test-related-fields');
@ -211,12 +209,12 @@ $(document).on('turbolinks:load', function() {
}; };
var old_execution_environment = $('#exercise_execution_environment_id').val(); var old_execution_environment = $('#exercise_execution_environment_id').val();
var observeExecutionEnvironment = function() { var observeExecutionEnvironment = function () {
$('#exercise_execution_environment_id').on('change', function(){ $('#exercise_execution_environment_id').on('change', function () {
new_execution_environment = $('#exercise_execution_environment_id').val(); new_execution_environment = $('#exercise_execution_environment_id').val();
if(new_execution_environment == '' && !$('#exercise_unpublished').prop('checked')){ if (new_execution_environment == '' && !$('#exercise_unpublished').prop('checked')) {
if(confirm('<%= I18n.t('exercises.form.unpublish_warning') %>')){ if (confirm('<%= I18n.t('exercises.form.unpublish_warning') %>')) {
$('#exercise_unpublished').prop('checked', true); $('#exercise_unpublished').prop('checked', true);
} else { } else {
return $('#exercise_execution_environment_id').val(old_execution_environment).trigger("chosen:updated"); return $('#exercise_execution_environment_id').val(old_execution_environment).trigger("chosen:updated");
@ -226,21 +224,21 @@ $(document).on('turbolinks:load', function() {
}); });
}; };
var observeUnpublishedState = function() { var observeUnpublishedState = function () {
$('#exercise_unpublished').on('change', function(){ $('#exercise_unpublished').on('change', function () {
if($('#exercise_unpublished').prop('checked')){ if ($('#exercise_unpublished').prop('checked')) {
if(!confirm('<%= I18n.t('exercises.form.unpublish_warning') %>')){ if (!confirm('<%= I18n.t('exercises.form.unpublish_warning') %>')) {
$('#exercise_unpublished').prop('checked', false); $('#exercise_unpublished').prop('checked', false);
} }
} else if($('#exercise_execution_environment_id').val() == '') { } else if ($('#exercise_execution_environment_id').val() == '') {
alert('<%= I18n.t('exercises.form.no_execution_environment_selected') %>'); alert('<%= I18n.t('exercises.form.no_execution_environment_selected') %>');
$('#exercise_unpublished').prop('checked', true); $('#exercise_unpublished').prop('checked', true);
} }
}) })
}; };
var observeExportButtons = function(){ var observeExportButtons = function () {
$('.export-start').on('click', function(e){ $('.export-start').on('click', function (e) {
e.preventDefault(); e.preventDefault();
$('#export-modal').modal({ $('#export-modal').modal({
height: 250 height: 250
@ -248,15 +246,15 @@ $(document).on('turbolinks:load', function() {
$('#export-modal').modal('show'); $('#export-modal').modal('show');
exportExerciseStart($(this).data().exerciseId); exportExerciseStart($(this).data().exerciseId);
}); });
$('body').on('click', '.export-retry-button', function(){ $('body').on('click', '.export-retry-button', function () {
exportExerciseStart($(this).data().exerciseId); exportExerciseStart($(this).data().exerciseId);
}); });
$('body').on('click', '.export-action', function(){ $('body').on('click', '.export-action', function () {
exportExerciseConfirm($(this).data().exerciseId); exportExerciseConfirm($(this).data().exerciseId);
}); });
} }
var exportExerciseStart = function(exerciseID) { var exportExerciseStart = function (exerciseID) {
var $exerciseDiv = $('#export-exercise'); var $exerciseDiv = $('#export-exercise');
var $messageDiv = $exerciseDiv.children('.export-message'); var $messageDiv = $exerciseDiv.children('.export-message');
var $actionsDiv = $exerciseDiv.children('.export-exercise-actions'); var $actionsDiv = $exerciseDiv.children('.export-exercise-actions');
@ -270,17 +268,17 @@ $(document).on('turbolinks:load', function() {
type: 'POST', type: 'POST',
url: '/exercises/' + exerciseID + '/export_external_check', url: '/exercises/' + exerciseID + '/export_external_check',
dataType: 'json', dataType: 'json',
success: function(response) { success: function (response) {
$messageDiv.html(response.message); $messageDiv.html(response.message);
return $actionsDiv.html(response.actions); return $actionsDiv.html(response.actions);
}, },
error: function(a, b, c) { error: function (a, b, c) {
return alert('error:' + c); return alert('error:' + c);
} }
}); });
}; };
var exportExerciseConfirm = function(exerciseID) { var exportExerciseConfirm = function (exerciseID) {
var $exerciseDiv = $('#export-exercise'); var $exerciseDiv = $('#export-exercise');
var $messageDiv = $exerciseDiv.children('.export-message'); var $messageDiv = $exerciseDiv.children('.export-message');
var $actionsDiv = $exerciseDiv.children('.export-exercise-actions'); var $actionsDiv = $exerciseDiv.children('.export-exercise-actions');
@ -289,13 +287,13 @@ $(document).on('turbolinks:load', function() {
type: 'POST', type: 'POST',
url: '/exercises/' + exerciseID + '/export_external_confirm', url: '/exercises/' + exerciseID + '/export_external_confirm',
dataType: 'json', dataType: 'json',
success: function(response) { success: function (response) {
$messageDiv.html(response.message) $messageDiv.html(response.message)
$actionsDiv.html(response.actions); $actionsDiv.html(response.actions);
if(response.status == 'success') { if (response.status == 'success') {
$messageDiv.addClass('export-success'); $messageDiv.addClass('export-success');
setTimeout((function() { setTimeout((function () {
$('#export-modal').modal('hide'); $('#export-modal').modal('hide');
$messageDiv.html('').removeClass('export-success'); $messageDiv.html('').removeClass('export-success');
}), 3000); }), 3000);
@ -303,14 +301,14 @@ $(document).on('turbolinks:load', function() {
$messageDiv.addClass('export-failure'); $messageDiv.addClass('export-failure');
} }
}, },
error: function(a, b, c) { error: function (a, b, c) {
return alert('error:' + c); return alert('error:' + c);
} }
}); });
}; };
var overrideTextareaTabBehavior = function() { var overrideTextareaTabBehavior = function () {
$('.form-group textarea[name$="[content]"]').on('keydown', function(event) { $('.form-group textarea[name$="[content]"]').on('keydown', function (event) {
if (event.which === TAB_KEY_CODE) { if (event.which === TAB_KEY_CODE) {
event.preventDefault(); event.preventDefault();
insertTabAtCursor($(this)); insertTabAtCursor($(this));
@ -318,10 +316,10 @@ $(document).on('turbolinks:load', function() {
}); });
}; };
var performBatchUpdate = function() { var performBatchUpdate = function () {
var jqxhr = $.ajax({ var jqxhr = $.ajax({
data: { data: {
exercises: _.map($('tbody tr'), function(element) { exercises: _.map($('tbody tr'), function (element) {
return { return {
id: $(element).data('id'), id: $(element).data('id'),
public: $('.public input', element).prop('checked') public: $('.public input', element).prop('checked')
@ -335,21 +333,21 @@ $(document).on('turbolinks:load', function() {
jqxhr.fail(ajaxError); jqxhr.fail(ajaxError);
}; };
var toggleCodeHeight = function() { var toggleCodeHeight = function () {
$('code').on('click', function() { $('code').on('click', function () {
$(this).css({ $(this).css({
'max-height': 'initial' 'max-height': 'initial'
}); });
}); });
}; };
var updateFileTemplates = function(fileType) { var updateFileTemplates = function (fileType) {
var rel_url_root = '<%= (defined? Rails.application.config.relative_url_root) && Rails.application.config.relative_url_root != nil && Rails.application.config.relative_url_root != "" ? Rails.application.config.relative_url_root : "" %>'; var rel_url_root = '<%= (defined? Rails.application.config.relative_url_root) && Rails.application.config.relative_url_root != nil && Rails.application.config.relative_url_root != "" ? Rails.application.config.relative_url_root : "" %>';
var jqxhr = $.ajax({ var jqxhr = $.ajax({
url: rel_url_root + '/file_templates/by_file_type/' + fileType + '.json', url: rel_url_root + '/file_templates/by_file_type/' + fileType + '.json',
dataType: 'json' dataType: 'json'
}); });
jqxhr.done(function(response) { jqxhr.done(function (response) {
var noTemplateLabel = $('#noTemplateLabel').data('text'); var noTemplateLabel = $('#noTemplateLabel').data('text');
var options = "<option value>" + noTemplateLabel + "</option>"; var options = "<option value>" + noTemplateLabel + "</option>";
for (var i = 0; i < response.length; i++) { for (var i = 0; i < response.length; i++) {
@ -377,8 +375,12 @@ $(document).on('turbolinks:load', function() {
overrideTextareaTabBehavior(); overrideTextareaTabBehavior();
} else if ($('#files.jstree').isPresent()) { } else if ($('#files.jstree').isPresent()) {
var fileTypeSelect = $('#code_ocean_file_file_type_id'); var fileTypeSelect = $('#code_ocean_file_file_type_id');
fileTypeSelect.on("change", function() {updateFileTemplates(fileTypeSelect.val())}); fileTypeSelect.on("change", function () {
updateFileTemplates(fileTypeSelect.val())
});
updateFileTemplates(fileTypeSelect.val()); updateFileTemplates(fileTypeSelect.val());
} else if ($('.export-start').isPresent()) {
observeExportButtons();
} }
toggleCodeHeight(); toggleCodeHeight();
if (window.hljs) { if (window.hljs) {

12
app/views/exercises/show.html.slim
View File

@ -7,7 +7,17 @@
h1 h1
= @exercise = @exercise
.btn-group.float-right
= render('shared/edit_button', object: @exercise) = render('shared/edit_button', object: @exercise)
button.btn.btn-secondary.float-right.dropdown-toggle data-toggle='dropdown' type='button'
ul.dropdown-menu.dropdown-menu-right role='menu'
li = link_to(t('exercises.index.implement'), implement_exercise_path(@exercise), 'data-turbolinks' => "false", class: 'dropdown-item text-dark') if policy(@exercise).implement?
li = link_to(t('shared.statistics'), statistics_exercise_path(@exercise), 'data-turbolinks' => "false", class: 'dropdown-item text-dark') if policy(@exercise).statistics?
li = link_to(t('activerecord.models.user_exercise_feedback.other'), feedback_exercise_path(@exercise), class: 'dropdown-item text-dark') if policy(@exercise).feedback?
li = link_to(t('activerecord.models.request_for_comment.other'), requests_for_comments_exercise_path(@exercise), class: 'dropdown-item text-dark') if policy(@exercise).requests_for_comments?
li = link_to(t('shared.destroy'), @exercise, data: {confirm: t('shared.confirm_destroy')}, method: :delete, class: 'dropdown-item text-dark') if policy(@exercise).destroy?
li = link_to(t('exercises.index.clone'), clone_exercise_path(@exercise), data: {confirm: t('shared.confirm_destroy')}, method: :post, class: 'dropdown-item text-dark') if policy(@exercise).clone?
li = link_to(t('exercises.export_codeharbor.label'), '', class: 'dropdown-item export-start text-dark', data: {'exercise-id' => @exercise.id}) if policy(@exercise).export_external_confirm?
= row(label: 'exercise.title', value: @exercise.title) = row(label: 'exercise.title', value: @exercise.title)
= row(label: 'exercise.user', value: link_to_if(policy(@exercise.author).show?, @exercise.author, @exercise.author)) = row(label: 'exercise.user', value: link_to_if(policy(@exercise.author).show?, @exercise.author, @exercise.author))
@ -42,3 +52,5 @@ ul.list-unstyled#files
- if policy(file).destroy? - if policy(file).destroy?
.clearfix = link_to(t('shared.destroy'), file, class:'btn btn-warning btn-sm float-right', data: {confirm: t('shared.confirm_destroy')}, method: :delete) .clearfix = link_to(t('shared.destroy'), file, class:'btn btn-warning btn-sm float-right', data: {confirm: t('shared.confirm_destroy')}, method: :delete)
= render('shared/file', file: file) = render('shared/file', file: file)
= render('shared/modal', id: 'export-modal', title: t('exercises.export_codeharbor.dialogtitle'), template: 'exercises/_export_dialogcontent')