$(document).on('turbolinks:load', function() { var ACE_FILES_PATH = '<%= "#{Rails.application.config.relative_url_root.chomp('/')}/assets/ace/" %>'; var THEME = 'ace/theme/textmate'; var currentSubmission = 0; var active_file = undefined; var fileTrees = []; var editor = undefined; var fileTypeById = {}; var showActiveFile = function() { var session = editor.getSession(); var fileType = fileTypeById[active_file.file_type_id]; session.setMode(fileType.editor_mode); session.setTabSize(fileType.indent_size); session.setValue(active_file.content); session.setUseSoftTabs(true); session.setUseWrapMode(true); // The event ready.jstree is fired too early and thus doesn't work. var selectFileInJsTree = function() { if (!filetree.hasClass('jstree-loading')) { filetree.jstree("deselect_all"); filetree.jstree().select_node(active_file.file_id); } else { setTimeout(selectFileInJsTree, 250); } }; filetree = $(fileTrees[currentSubmission]); selectFileInJsTree(); // Finally change jstree element to prevent flickering showFileTree(currentSubmission); }; var initializeFileTree = function() { $('.files').each(function(index, element) { fileTree = $(element).jstree($(element).data('entries')); fileTree.on('click', 'li.jstree-leaf', function() { var id = parseInt($(this).attr('id')); _.each(files[currentSubmission], function(file) { if (file.file_id === id) { active_file = file; } }); showActiveFile(); }); fileTrees.push(fileTree); }); }; var showFileTree = function(index) { $('.files').hide(); $(fileTrees[index]).show(); }; if ($.isController('exercises') && $('#timeline').isPresent()) { _.each(['modePath', 'themePath', 'workerPath'], function(attribute) { ace.config.set(attribute, ACE_FILES_PATH); }); var slider = $('#submissions-slider>input'); var submissions = $('#data').data('submissions'); var files = $('#data').data('files'); var filetypes = $('#data').data('file-types'); var playButton = $('#play-button'); var playInterval = undefined; editor = ace.edit('current-file'); editor.setShowPrintMargin(false); editor.setTheme(THEME); editor.$blockScrolling = Infinity; editor.setReadOnly(true); _.each(filetypes, function (filetype) { filetype = JSON.parse(filetype); fileTypeById[filetype.id] = filetype; }); $('tr[data-id]>.clickable').each(function(index, element) { element = $(element); element.click(function() { slider.val(index); slider.change() }); }); const onSliderChange = function(event) { currentSubmission = slider.val(); var currentFiles = files[currentSubmission]; var fileIndex = 0; _.each(currentFiles, function(file, index) { if (file.name === active_file.name) { fileIndex = index; } }); active_file = currentFiles[fileIndex]; showActiveFile(); }; slider.on('change', onSliderChange); stopReplay = function() { clearInterval(playInterval); playInterval = undefined; playButton.find('span.fa').removeClass('fa-pause').addClass('fa-play') }; playButton.on('click', function(event) { if (playInterval === undefined) { // Reset slider if showing newest submission. if (parseInt(slider.val()) === submissions.length - 1) { slider.val(0); onSliderChange(); } playInterval = setInterval(function() { if ($.isController('exercises') && $('#timeline').isPresent() && slider.val() < submissions.length - 1) { slider.val(parseInt(slider.val()) + 1); slider.change() } else { stopReplay(); } }, 1000); playButton.find('span.fa').removeClass('fa-play').addClass('fa-pause') } else { stopReplay(); } }); active_file = files[0][0]; initializeFileTree(); showActiveFile(); // Start with newest submission slider.val(submissions.length - 1); onSliderChange(); } });