Advancing a Canvancement Tool - Adding a student's name to their Grades Page
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hello Canvas Devs!
I'm working on an update to @James awesome Canvancement script Add a student's name to their Grades page and I ran into a snag.The jQuery function adds appended code into the HTML, but the content isn't visible within the browser.
Here's the jQuery code:
if (matches) {
$("aside#right-side").css("display", "inline-block").append('<div id="GradeWidget-grades-note">
<h3>Grading Notes</h3>
<p>The total grade is not necessarily a predictor of an end of term grade, rather it is a snapshot of current progress. For example, prior to large assignments (test, projects, papers) being graded, smaller assignments heavily influence the overall grade.
<strong>Students and parents are urged to speak with your Teacher if you have questions.</strong>
</p>
<ul id="GradeWidget-grades-notes-list"><li><img alt="Complete" class="graded_icon" src="/images/pass.png"> Assignment is turned in.</li>
<li>"-" Assignment has not been logged or is missing. </li>
<li><img alt="Text_entry" class="submission_icon" src="/images/file.png?1348285576"> A digital file was submitted and grades are pending.</li>
</ul>
<h3>Grading Scheme</h3>
<table border="0">
<tbody>
<tr>
<th scope="col">Name</th>
<th scope="col">Range</th>
<th scope="col"> </th>
</tr>
<tr>
<td>A</td>
<td>100%</td>
<td>to 92.5%</td>
</tr>
<tr>
<td>A-</td>
<td>< 92.5%</td>
<td>to 89.5%</td>
</tr>
<tr>
<td>B+</td>
<td>< 89.5%</td>
<td>to 86.5%</td>
</tr>
<tr>
<td>B</td>
<td>< 86.5%</td>
<td>to 82.5%</td>
</tr>
<tr>
<td>B-</td>
<td>< 82.5%</td>
<td>to 79.5%</td>
</tr>
<tr>
<td>C+</td>
<td>< 79.5%</td>
<td>to 76.5%</td>
</tr>
<tr>
<td>C</td>
<td>< 76.5%</td>
<td>to 72.5%</td>
</tr>
<tr>
<td>C-</td>
<td>< 72.5%</td>
<td>to 69.5%</td>
</tr>
<tr>
<td>D+</td>
<td>< 69.5%</td>
<td>to 66.5%</td>
</tr>
<tr>
<td>D</td>
<td>< 66.5%</td>
<td>to 62.5%</td>
</tr>
<tr>
<td>D-</td>
<td>< 62.5%</td>
<td>to 59.5%</td>
</tr>
<tr>
<td>F</td>
<td>< 59.5%</td>
<td>to 0%</td>
</tr>
</tbody>
</table>
</div>');
}
Here's the whole block for contex:
// ==UserScript==
// @name Add Name to Grades page
// Adapted from James Jones' Canvancement Tools
// Canvancement Tools can be found at https://github.com/jamesjonesmath/canvancement/
// ==/UserScript==
var includeSisId = true;
var nameOrder = [
'short_name',
'name',
'sortable_name'
];
var regex = new RegExp('/users/([0-9]+)/grades$');
var matches = regex.exec(document.location);
if (matches) {
$.getJSON('/api/v1/users/' + matches[1], function (data) {
var name;
for (var i = 0; i < nameOrder.length; i++) {
var key = nameOrder[i];
if (typeof data[key] !== 'undefined' && data[key]) {
name = data[key];
break;
}
}
if (includeSisId && typeof data.sis_user_id !== 'undefined' && data.sis_user_id) {
name += ' (' + data.sis_user_id + ')';
}
console.log(name);
if (typeof name !== 'undefined') {
$('h2:contains("Courses ")').text(name);
}
if (matches) {
$("aside#right-side").css("display", "inline-block").append('<div id="GradeWidget-grades-note">
<h3>Grading Notes</h3>
<p>The total grade is not necessarily a predictor of an end of term grade, rather it is a snapshot of current progress. For example, prior to large assignments (test, projects, papers) being graded, smaller assignments heavily influence the overall grade.
<strong>Students and parents are urged to speak with your Teacher if you have questions.</strong>
</p>
<ul id="GradeWidget-grades-notes-list"><li><img alt="Complete" class="graded_icon" src="/images/pass.png"> Assignment is turned in.</li>
<li>"-" Assignment has not been logged or is missing. </li>
<li><img alt="Text_entry" class="submission_icon" src="/images/file.png?1348285576"> A digital file was submitted and grades are pending.</li>
</ul>
<h3>Grading Scheme</h3>
<table border="0">
<tbody>
<tr>
<th scope="col">Name</th>
<th scope="col">Range</th>
<th scope="col"> </th>
</tr>
<tr>
<td>A</td>
<td>100%</td>
<td>to 92.5%</td>
</tr>
<tr>
<td>A-</td>
<td>< 92.5%</td>
<td>to 89.5%</td>
</tr>
<tr>
<td>B+</td>
<td>< 89.5%</td>
<td>to 86.5%</td>
</tr>
<tr>
<td>B</td>
<td>< 86.5%</td>
<td>to 82.5%</td>
</tr>
<tr>
<td>B-</td>
<td>< 82.5%</td>
<td>to 79.5%</td>
</tr>
<tr>
<td>C+</td>
<td>< 79.5%</td>
<td>to 76.5%</td>
</tr>
<tr>
<td>C</td>
<td>< 76.5%</td>
<td>to 72.5%</td>
</tr>
<tr>
<td>C-</td>
<td>< 72.5%</td>
<td>to 69.5%</td>
</tr>
<tr>
<td>D+</td>
<td>< 69.5%</td>
<td>to 66.5%</td>
</tr>
<tr>
<td>D</td>
<td>< 66.5%</td>
<td>to 62.5%</td>
</tr>
<tr>
<td>D-</td>
<td>< 62.5%</td>
<td>to 59.5%</td>
</tr>
<tr>
<td>F</td>
<td>< 59.5%</td>
<td>to 0%</td>
</tr>
</tbody>
</table>
</div>');
}
});
}
Any suggestions on getting this code to be visible would be deeply appreciated!
Thank you,
Jason