Skip to content

Commit

Permalink
CTP-3783 avoid clone table
Browse files Browse the repository at this point in the history
  • Loading branch information
@watson8
watson8 committed Oct 15, 2024
1 parent c498792 commit eb03d5b
Show file tree
Hide file tree
Showing 2 changed files with 58 additions and 95 deletions.
126 changes: 40 additions & 86 deletions datatables/js/datatables.js
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,11 @@
var table_obj_list = [];
var id = 0;
var array_button_grade = [];
var is_responsive = false;
var form_plagiarism_alert_change = false;
var form_moderation_agreement_change = false;
var fullload = false;
var display_suspended_gbl = 0;
var tableobject = 0;

$( document ).ready(function() {



var langmessage = JSON.parse($('#element_lang_messages').attr('data-lang'));

var base_url = window.location.origin + '/mod/coursework/datatables/js/';
var base_url = window.location.origin + '/mod/coursework/datatables/js/';

require.config({
paths: {
Expand All @@ -24,7 +15,7 @@ $( document ).ready(function() {
'datatables.buttons': base_url + 'datatables.buttons',
'datatables.select': base_url + 'datatables.select',
'datatables.responsive': base_url + 'datatables.responsive.min',
'jquery-mousewheel': base_url +'jquery.mousewheel',
'jquery-mousewheel': base_url + 'jquery.mousewheel',
'datetimepicker': base_url + 'jquery.datetimepicker',

}
Expand All @@ -41,22 +32,22 @@ $( document ).ready(function() {
};
$.fn.dataTable.Api.register('row().show()', function() {
var page_info = this.table().page.info();
// Get row index
// Get row index.
var new_row_index = this.index();
// Row position
// Row position.
var row_position = this.table()
.rows({ search: 'applied' })[0]
.indexOf(new_row_index);
// Already on right page ?
if ((row_position >= page_info.start && row_position < page_info.end) || row_position < 0) {
// Return row object
// Return row object.
return this;
}
// Find page number
// Find page number.
var page_to_display = Math.floor(row_position / this.table().page.len());
// Go to that page
// Go to that page.
this.table().page(page_to_display);
// Return row object
// Return row object.
return this;
});
require(['jquery', 'datatables.searchpanes'], function($) {
Expand Down Expand Up @@ -89,12 +80,9 @@ $( document ).ready(function() {
var wrapperelement = tableelement.parent('.dataTables_wrapper');
var paginationelement = wrapperelement.find('.dataTables_paginate');
tableobject = table_obj_list[tableid];
var submissionswrapper = tableelement.parent('.dataTables_wrapper');

var submissionswrapper = tableelement.parent('.dataTables_wrapper');



// hide buttons
// Hide buttons.
wrapperelement.find('.dataTables_paginate, .dataTables_info, .dataTables_length, .dataTables_filter').css('visibility', 'hidden');
wrapperelement.find('thead, .dt-button').each(function() {
var me = $(this);
Expand All @@ -109,7 +97,7 @@ $( document ).ready(function() {
$('<div class="text-center pagination-loading"><i class="fa fa-spinner fa-spin"></i> ' + langmessage.loadingpagination + '</div>').insertAfter(paginationelement);
$('<i class="fa fa-spinner fa-spin pagination-loading"></i>').insertBefore(wrapperelement.find('.dt-button > span'));

// prepare params for ajax request
// Prepare params for ajax request.
var params = {
group: tableelement.attr('group'),
perpage: tableelement.attr('perpage'),
Expand All @@ -131,11 +119,9 @@ $( document ).ready(function() {
console.log('test remove 1');
$("#datatable_top_loading_message").remove();
tableobject.rows.add($(response)).draw(false);
// move_to_page_initial(tableid);
wrapperelement.find('.submission-loading').remove();
// tableobject.searchPanes.rebuildPane(); // => comment out this line in case of removing the filter button with its searchpane
}).fail(function() {}).always(function() {
// show buttons
// Show buttons.
wrapperelement.find('.pagination-loading').remove();
wrapperelement.find('.submission-loading').remove();
wrapperelement.find('thead, .dt-button').css('pointer-events', 'auto');
Expand All @@ -144,18 +130,15 @@ $( document ).ready(function() {
}

function initDatatable(is_responsive) {

$(".datatabletest").each(function () {

//class that determines whether all data for the databale has been full loaded
// Class that determines whether all data for the databale has been full loaded.
var fullloaded = $(this).hasClass('full-loaded');

var table = $(this).DataTable( {
$(this).DataTable({
'order': [],
stateSave: true,
language: {
searchPanes: {
collapse: {0: $('#search_pane_button').val() || 'Filter', _:($('#search_pane_button').val() || 'Filter')+' (%d)'}
collapse: {0: $('#search_pane_button').val() || 'Filter', _:($('#search_pane_button').val() || 'Filter') + ' (%d)'}
}
},
buttons:[
Expand All @@ -164,16 +147,12 @@ $( document ).ready(function() {
dom: 'Blfrtip',
columnDefs:[
{
searchPanes:{
show: false
},
searchPanes:{show: false},
targets: ['studentname','addition-multiple-button'],
bSortable: false
},
{
searchPanes: {
show: false
},
searchPanes: {show: false},
targets: ['lastname_cell','firstname_cell','tableheadpersonaldeadline', 'tableheaddate', 'tableheadfilename', 'tableheadplagiarismalert', 'plagiarism', 'agreedgrade', 'feedbackandgrading', 'provisionalgrade', 'tableheadmoderationagreement']
},
{
Expand Down Expand Up @@ -222,26 +201,11 @@ $( document ).ready(function() {
if (!fullloaded) {
background_load_table($(this).attr('id'));
}




});

}

function move_to_page_initial(table_id) {
var key = 'datatable_navigate_' + window.location.href + table_id;
var id = localStorage.getItem(key);
if (id) {
table_obj_list[table_id].row('#' + id).show().draw(false);
}
// clear id
localStorage.removeItem(key);
}

if(isMobileDevice() && $(window).width() < 768) {
// For small screens
// For small screens.
var table = $('.datatabletest tbody').on('click', 'td.details-control', function () {
var tr = $(this).closest("tr");
var row_id = tr.attr('id').replace('allocatable_', '');
Expand All @@ -251,18 +215,19 @@ $( document ).ready(function() {
$(tr).next('tr.row_assessors').remove();
}
else {
$('<tr class = "submissionrowmultisub row_assessors">'+
'<td class="assessors" colspan = "11"><table class="assessors assessors_expanded" style="width:95%">' + $('#' + table_id).clone().html() + '</table></td>' +
'</tr>').insertAfter($(tr));
// As originally written this code created a new table with duplicate IDs.
// See comment on CTP-3783 below for more info.
const oldTable = $('#' + table_id);
const newRow = $(
'<tr class = "submissionrowmultisub row_assessors"><td class="assessors" colspan = "11"></td></tr>'
);
oldTable.addClass('assessors_expanded').css('width', '95%').appendTo(newRow.find('td'));
}

$(tr).toggleClass('shown');
// $("#" + table_id).toggleClass('tbl_assessor_shown');
// $("#" + table_id).DataTable({ 'dom': '', 'responsive': true });
});
}
else {
// Add event listener for opening and closing details
// Add event listener for opening and closing details.
$('.datatabletest tbody').on('click', 'td.details-control', function () {
console.log('clicking button');
var tr = $(this).closest("tr");
Expand All @@ -273,29 +238,31 @@ $( document ).ready(function() {

var row_id = tr.attr('id').replace('allocatable_', '');
var table_id = 'assessorfeedbacktable_' + row_id;

if ($('#' + table_id).length > 0) {
const oldTable = $('#' + table_id);
if (oldTable.length) {
if ( row.child.isShown() ) {
// This row is already open - close it
// This row is already open - close it.
row.child.hide();
tr.removeClass('shown');
}
else {
// Open this row
// row.child( format(row.data()) ).show();
row.child($(
'<table class="assessors" width="100%"><tr class = "submissionrowmultisub">'+
'<td class="assessors" colspan = "11"><table class="assessors assessors_expanded">' + $('#' + table_id).clone().html() + '</table></td>' +
'</tr></table>'
)).show();
// Open this row.
// CTP-3783 As originally written this code cloned the old table and added its HTML again to the new row.
// This meant that we had 2 x tables do duplicate IDs, with the old table hidden and new one visible.
// The multiple behat tests failed when trying to click the hidden feedback button not visible one.
const newRow = $(
'<tr class = "submissionrowmultisub"><td class="assessors" colspan = "11"></td></tr>'
);
oldTable.addClass('assessors_expanded').css('width', '95%').appendTo(newRow.find('td'));
oldTable.show();
row.child(newRow).show();
tr.addClass('shown');
}
}
}
});
}


$('.datatabletest').on('click', '.splitter-firstname, .splitter-lastname, .splitter-email', function (event) {
event.preventDefault();
var node = $(event.target),
Expand All @@ -305,33 +272,20 @@ $( document ).ready(function() {
currentsort = 'desc';
sortby = 'asc';
}

//node.closest('#example').DataTable()
// .order( [ sortColumn, sortby ] )
// .draw();
var table_id = $(this).closest('.datatabletest').attr('id');
table = table_obj_list[table_id];
var headerclass = $(this).hasClass('splitter-firstname') ? 'firstname_cell' : 'lastname_cell';
headerclass = $(this).hasClass('splitter-email') ? 'email_cell' : headerclass;
console.log(headerclass);
var sortColumn = table.column('.' + headerclass).index();
console.log(sortColumn);
console.log(sortby);
console.log(table);
table.order([sortColumn, sortby]).draw();

node.addClass('sorting_' + sortby).removeClass('sorting sorting_' + currentsort);
node.parent().removeClass('sorting sorting_asc sorting_desc');
node.siblings().removeClass('sorting_asc sorting_desc').addClass('sorting');
});


});


function isMobileDevice() {
if ( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
return true;
}
return false;
return (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent));
}
27 changes: 18 additions & 9 deletions tests/behat/feedback_edit_feedback_within_specified_time.feature
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@mod @mod_coursework
@mod @mod_coursework @mod_coursework_feedback_edit_specified_time
Feature: Allow markers to edit their marking but only during specific marking stages

As an initial marker
Expand All @@ -17,10 +17,13 @@ Feature: Allow markers to edit their marking but only during specific marking st
And the student has a submission
And the submission is finalised

@javascript
Scenario: Edit own initial feedback before delayed time
Given there are feedbacks from both teachers
And I log in as the teacher
And I visit the coursework page
And I expand the coursework grading row
# todo This is a problem because JS is duplicating the table so we get multiple rows e.g. for #edit_feedback_212000
Then I should see the edit feedback button for the teacher's feedback

@javascript
Expand All @@ -29,20 +32,25 @@ Feature: Allow markers to edit their marking but only during specific marking st
And I wait "35" seconds
And I log in as the teacher
And I visit the coursework page
And I expand the coursework grading row
Then I should not see the edit feedback button for the teacher's feedback

@javascript
Scenario: Automatic agreement before delayed time
Given the coursework "automaticagreementstrategy" setting is "percentage_distance" in the database
And the coursework "automaticagreementrange" setting is "10" in the database
And I am logged in as a teacher
And I visit the coursework page
And I click on the new feedback button for assessor 1
And I grade the submission as 67 without comments using the simple form
And I expand the coursework grading row
And I click on the only interactable link with title "New feedback"
And I grade the submission as 67 using the ajax form
And I log out

And I log in as the other teacher
And I visit the coursework page
And I click on the new feedback button for assessor 2
And I grade the submission as 63 without comments using the simple form
And I expand the coursework grading row
And I click on the only interactable link with title "New feedback"
And I grade the submission as 63 using the ajax form
And I visit the coursework page
Then I should not see the final grade on the multiple marker page

Expand All @@ -52,13 +60,14 @@ Feature: Allow markers to edit their marking but only during specific marking st
And the coursework "automaticagreementrange" setting is "10" in the database
And I am logged in as a teacher
And I visit the coursework page
And I click on the new feedback button for assessor 1
And I grade the submission as 67 without comments using the simple form
And I click on the only interactable link with title "New feedback"
And I grade the submission as 67 using the ajax form
And I log out

And I log in as the other teacher
And I visit the coursework page
And I click on the new feedback button for assessor 2
And I grade the submission as 63 without comments using the simple form
And I click on the only interactable link with title "New feedback"
And I grade the submission as 63 using the ajax form
And I wait "50" seconds
And I visit the coursework page
Then I should see the final grade as 67 on the multiple marker page

0 comments on commit eb03d5b

Please sign in to comment.