Moodle Turnitin: add functionality to insert extra

Some universities have a Blue Card scheme enabling students with specific learning difficulties (SpLDs) to flag their work with a blue card, so the tutor will mark it with due consideration.

We needed a way of making it easier for students to flag their work with a blue card, and I have come up with the following script, which goes into the Additional HTML section in Site Administration in Moodle, and works with the Turnitin plugin. (See my other post for a script that works with the Moodle Assignment functionality.)

First the student clicks the button to add the blue card, which inserts the text "Blue Card: " at the start of the assignment title. When the form is submitted, the JavaScript looks for the text "Blue Card" on the next page, colours the table cell blue and appends a link to the dyslexia marking guidelines.

<script type="text/javascript">
var TurnitinBlueCardButton =  '<input type="button" id="tiibluecard" value="Flag with Blue Card"/> <a href="http://www.brookes.ac.uk/students/wellbeing/dyslexia-spld/blue-marking-cards/" class="info" target="_blank" title="What is the Blue Card scheme?">What\'s this?</a><br/>'

/* TURNITIN BLUE CARD */
if (!document.getElementById('fitem_id_submissiontype')) {
   /* do nothing */
} else {
    document.getElementById('fitem_id_submissiontype').insertAdjacentHTML('beforebegin', TurnitinBlueCardButton);
}

/* EVENT LISTENER FOR TURNITIN BLUE CARD BUTTON */
if (!document.getElementById('tiibluecard')) {
   /* do nothing */
} else {
    document.getElementById("tiibluecard").addEventListener('click', function () {  
        var title = document.getElementById('id_submissiontitle');
        /* turn off validation of title field, as it will now have a value */
        title.removeAttribute('onchange');
        if (!title.value) {
            title.value = ('Blue Card: '); 
         } else {
            title.value = ('Blue Card: ' + title.value);
         }
    });
}

/* highlight blue card in TURNITIN submission inbox table */
if (!document.getElementById('inboxTable')) {
   /* do nothing */
} else {
     var table = document.getElementById('inboxTable');
     var tbody = table.getElementsByTagName('tbody')[0];
     var cells = tbody.getElementsByTagName('td');

     for (var i=0, len=cells.length; i<len; i++){
         if (cells[i].innerHTML.includes('Blue Card')){
             cells[i].style.backgroundColor = '#99ccff';
             cells[i].innerHTML += ' [<a href="http://www.brookes.ac.uk/students/wellbeing/dyslexia-spld/blue-marking-cards/" class="info" target="_blank" title="What is the Blue Card scheme?">What\'s this?</a>]';
        }
   }
}
</script>

NB: code is supplied 'as is' without any commitment to it being fit for purpose and is also supplied without any commitment to maintenance or support.

(also posted on our team blog)

UPDATE: in order to get this to work in Internet Explorer 11, I had to change a couple of things:

/* highlight blue card in TURNITIN submission inbox table */
if (!document.getElementById('inboxTable')) {
   /* do nothing */
} else {
     var table = document.getElementById('inboxTable');
     var tbody = table.getElementsByTagName('tbody')[0];
     var cells = tbody.getElementsByTagName('td');

     for (var i=0, len=cells.length; i<len; i++){
         if (cells[i].innerText.search('Blue Card') > -1){
             cells[i].style.backgroundColor = '#99ccff';
             cells[i].getElementsByTagName('a')[0].insertAdjacentHTML('afterend', ' [<a href="http://www.brookes.ac.uk/staff/academic/dyslexia-spld-service/marking-work/" class="info" target="_blank" title="What is the Blue Card scheme?">What\'s this?</a>]');
        }
   }
}