Canvas Admin Course Search and Admin Flyout Menu Enhancements

Code-with-Ski
Community Coach
Community Coach
47
8222

I recently updated my Canvas LMS Mods (Basic) Chrome extension to provide some new enhancements to the course search and admin flyout menu.

In the course search, I have added the following enhancements:

  • Adding a select menu to search for courses based on their published state (published only, unpublished only, both [default]).
  • Adding a button to sort by the Canvas course ID. This can be helpful if you are trying to find and/or audit the most recently created courses.
  • Showing the course code under the course name in the search results.
  • Adding a lock icon before the course name, if the course is concluded.
  • Converting the number of students to a link to People in the course.
  • Adding a link to the gradebook under the number of students.
  • Converting the subaccount name to a link to that subaccount, if the admin has the manage settings permission in the current account.

Course search view with enhancements activeCourse search view with enhancements active

 

In the admin flyout menu, I have added some enhancements based on an older idea I saw in the community:

  • A select menu is loaded when opened with accounts accessible by the admin user.
    • It will load in all of the manageable accounts for the admin.
    • If there are no accounts returned from the manageable accounts' endpoint, then it will fall back to just the accounts the admin has access to view.
    • The account that is selected will be used as the account for each of the searches/buttons below it.
  • A course search section is loaded.
    • The terms are loaded into a select menu.
    • The native search options are included along with the enhanced search options that I have added on the course search page.
  • A people search section is loaded.
    • The course roles are loaded into a select menu.
    • An input for the search term is included.
  • Additional buttons for the following:
    • Admin tools
    • Account reports

Admin flyout menu account selectAdmin flyout menu account select

Admin flyout menu term selectAdmin flyout menu term select

Admin flyout menu course searchAdmin flyout menu course search

Admin flyout menu people search and buttonsAdmin flyout menu people search and buttons

You can view the code for the Chrome extension in the GitHub repository. The JavaScript for the enhancements can be found in the following:

If you use the Chrome extension, you can use the extension options to disable features you don't need or may not be fully functional with your instance.  I appreciate any feedback you have and will do my best to resolve bugs in a timely manner.

47 Comments
Code-with-Ski
Community Coach
Community Coach
Author

Hello @RobDitto,

Your idea [Admin Tools] Sort Newest/Oldest in New Course Search for Admins inspired the sort by course ID feature in my latest release.  Using the button will automatically update the URL as needed and re-sort the results.  By sorting in descending order, it should make it so the most recently created courses appear first.  If you try this Chrome extension or adapt the code to your own theme, I would appreciate any feedback you have on it.

Code-with-Ski
Community Coach
Community Coach
Author

Hello @jfountain,

Your idea [Admin Tools] Show Completed Courses Indicator in Admin GUI inspired adding a locked icon before the course name to indicate if a course is concluded.  If you try this Chrome extension or adapt the code to your own theme, I would appreciate any feedback you have on it.

Code-with-Ski
Community Coach
Community Coach
Author

Hello @ashley_hardesty,

Your idea [Admin Tools] Link to PEOPLE page, from the Admin Courses page inspired converting the number of students to a link to the People for the course.  If you try this Chrome extension or adapt the code to your own theme, I would appreciate any feedback you have on it.

Code-with-Ski
Community Coach
Community Coach
Author

Hello @cms_hickss,

Your idea [Course Settings] Make Sub-Account Name a Hyperlink in the New Course Search inspired converting the subaccount name to a link to that subaccount.  Currently the link will only appear if the admin user has the manage settings permission.  If you try this Chrome extension or adapt the code to your own theme, I would appreciate any feedback you have on it.

Code-with-Ski
Community Coach
Community Coach
Author

Hello @awilliams and @bgibson,

Your idea and mock-ups for [Admin Tools] Leave Admin Account Items in Sidebar inspired the quick access admin functions that I added to the admin flyout menu (course search, people search, admin tools link, and account reports link).  If you try this Chrome extension or adapt the code to your own theme, I would appreciate any feedback you have on it.

@canvas_admin@hesspe@kona@KristinL,  @Robbie_Grant@kmeeusen,   

I also saw you were interested in testing this idea and I would appreciate any feedback you have if you try the Chrome extension or adapt the code to your own theme.

dgrobani
Community Champion

@Code-with-Ski James, much-belated person-to-person kudos to you for your work on this and for sharing it!

DanL
Community Participant

This extension is absolutely AMAZING!!!

I'm in awe.  Thank you so much for providing it!  You've got some Extension and Canvas SKILLZ! 😃

I'm curious if you can add a link in the Admin - SubAccounts area where it lists "N Courses" that would take you to those courses?

In particular, the Top-Level (root) Account, when it has courses, I'm wondering if there's a way Canvas would show only them by narrowing it?  I mean, I know all the titles for the other accounts will take you to their course lists, but that top level, you can't really narrow it to just those courses.  At least I haven't found a way in the default interface yet, other than sorting by SubAccount and paging MANY times to finally find it in the alphabet.  I opened a feature request a while ago, but you know how that goes. haha

Anyway, if you know a way, that would be very cool!

Thanks again!  Truly spectacular work!

Code-with-Ski
Community Coach
Community Coach
Author

@dgrobani Thank you for the kudos and you are welcome 😀 I'm glad I'm able to help bring some of the ideas people have suggested to life

Code-with-Ski
Community Coach
Community Coach
Author

@DanL Thank you and you are welcome 😀 I've enjoyed discovering what things are possible to do and sharing them with the community.

That is actually one of the ideas that I had on my list to investigate and wanted to add as an enhancement to the course search.  Unfortunately, I didn't see an option with the List active courses in an account endpoint to exclude courses from sub-accounts.  If anyone has any suggestions for this, I would be happy to investigate further.  

I still have it on my list of ideas that I would like to develop if I can find a way to do it without too much load time.  Right now the only option I can think of is getting everyone course in the account and then filtering the list to just that specific account.  However, I'm concerned that would result in a long loading time, especially when there are only a few courses that you are looking for.

DanL
Community Participant

@Code-with-Ski yes, I get that.

Have done some API stuff, but nothing to the level you've done.  The pagination Canvas uses can be quite the challenge.

Thanks for considering, and totally understand if it's not possible given the API limitations.

I'm actually exploring Canvas Data 2 to get that info... of course it will accessed separately from our Canvas system but at least we'll be able to narrow it down easier.

DanL
Community Participant

Would love to see an "Act As User" icon/link/option in the People lists inside course rosters.  Maybe under the three-dot kebab menu?

And as always, this Extension is incredible!

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

Yeah, the pagination can be annoying to deal with, especially when they use bookmarks instead of page numbers.  I've also started to see that you have to be careful with some API calls that are paginated because they provide an object rather than array so you then have to make sure you deal with those cases properly.

For the "Act As User", if you click on a person's name in the flyout menu that opens on the right it should show "Act as User" for students.  However, I have thought about seeing if I could add that "Act as User" for other roles too like the teacher.  It is surprising how many clicks it takes to act as a teacher when it is so easy to act as a student.

DanL
Community Participant

Now that we have the view into any jobs that are "initializing" I notice there is a job that is still in that state 9 days after it started, which your note says "may need to be aborted".

Would it be worth it to include an "abort job" link?  It obviously wouldn't work for a non-Admin.

Just curious if you've considered it?

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

For this Basic version, I am limiting myself to only use API calls that GET information.  This is in case there are Universities that restrict permitted Chrome extensions and don't want to approve one that can make changes to the system data.

However, if I have time this summer, I am thinking about making an Advanced version that would include features that make other types of API calls too.  An abort job button is one example of a feature that I've been considering.  Currently I use Postman to abort calls as needed, but it would be easier if I could do it from the GUI when reviewing the log.

Code-with-Ski
Community Coach
Community Coach
Author

@mjennings 

I'm not sure if you saw this yet, but I thought you might be interested based on the Idea you submitted.

DanL
Community Participant

@Code-with-Ski GET-only operations totally makes sense.

I would happily beta test an advanced version for you. 😉

 

In SIS Import details, how about a link to both the CSV attachment (CSV submitted) and the error attachment (if available)?

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

I'll need to do some testing with that, but adding links to those files in the SIS Import log seems like it would be feasible.

I'll also keep you in mind for beta testing when I begin developing an advanced version!

mjennings
Community Contributor

@Code-with-Ski thanks for sharing. Does this work like a User Script? My institution is a little funny about adding extensions, but ok with UserScripts in TamperMonkey.

Code-with-Ski
Community Coach
Community Coach
Author

@mjennings 

You're welcome!  It is similar to the same idea as using a User Script with TamperMonkey since it provides modifications on the page locally for you; however, it is not designed specifically for use with TamperMonkey.  I have made my code for this open source and you are welcome to make your own copy and update it to work with TamperMonkey and/or see if your institution is open to reviewing it to approve.

DanL
Community Participant

For admins, I would love to see the User's SIS ID, Login ID and email after their names in Discussion Board postings:

https://[instance].instructure.com/courses/#####/discussion_topics/######

Also, a link to their User Information page under the 3-dot menu:

https://[instance].instructure.com/accounts/#/users/#####

Thanks again for all you do to make our Canvas lives easier!

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

You're welcome 😀  I'm glad to hear it is helping to make your work in Canvas easier.

For your suggestions about Discussions above, could you provide more details about what you hope to achieve with this added information and link?  I created a Discussion Replies report on the Course Statistics page that may provide some of this information if it helps in the meantime.

DanL
Community Participant

Sure, no problem!

We have a non-academic course that has over 3,000 people enrolled.

Some of them have started discussion threads saying "please remove me", and there's quite a few I have to go through.

One by one, I have to use their names only (only thing that displays in discussions) and search separately for the actual IDs, which as you know, names aren't always unique.

Honestly, my PREFERENCE would be a comma-separated list of all SIS IDs, but didn't think that would be too useful for most of your users. haha

I'm also looking at ways to get this via the API or Canvas Data 2.

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

Thanks for the description of the problem.  That is definitely understandable for why you are looking for that information.

If you are using the latest update, you should see Custom Course Reports when you go to the Course Statistics within a course.  The link can be found on the Course home page where I have added a link in the right-side menu or natively in the Course Settings page in the right-hand side menu.  The Discussion Replies report would allow you to load all discussion replies within the course.  After the data loads in the table, you can download the table as a CSV.  While I don't have SIS ID and email as a part of it currently, I do have the Author ID, which is the Canvas User ID that can also be used to identify users.  With this report, you could open it in Microsoft Excel or another spreadsheet application and search for those types of replies to find the users that are requesting to be removed.

I will add to my queue to see if I can build a report with the details you are requesting.  Considering I have seen other ideas of users requesting the ability to download all the responses from a discussion board, I may be able to integrate the data you are requesting with that report at an individual discussion board level.  It would be similar to the grade export report that I added for assignments and discussion boards, but instead focus on exporting the discussion board responses.  I can try to get the additional data you are requesting to be a part of the user information that I include in the report.

I'll need to see how the 3-dot menu works in the current discussion boards and the new discussion boards to know if I would be able to add a link to the user page.  If I can get it to work, I would likely make it a link to the user's course profile so it could be generically used by teachers too and then that page would have a link to the user's account level profile if you need that as an admin.

DanL
Community Participant

Wow, I hadn't noticed all those reports!  Very nice.  I have version 4.0.0

I did try the Discussion Replies report, but it just spins and never comes back.  Maybe because the 3,000+ enrollments?

Amazing how receptive you are to new ideas!  Even if they all don't make it, it's nice to be heard/considered.  Thanks so much!

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

Thank you! 

I haven't done much testing with large amounts of data as I wasn't anticipating too much data in a single course, but I didn't account for large enrollment courses.  I will need to look into providing better loading information so users can know more about the current status of loading the data and/or providing an option to load the data in smaller chunks rather than all at once. 

If you use the Developer Tools and see any errors in the console, let me know and I can investigate them.  You can also use the Network tab in the Developer Tools to see if requests are still processing.  If you still see requests getting added, then that is an indication that it is still processing rather than an error causing it to get stuck on loading. *Developer Tools can be accessed by right-clicking on the web page and choosing "Inspect".

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

I released a new update (v5.0.0) that includes loading messages on the course reports now.  It will let you know what part of the process it is working on for getting the necessary data and loading it into the report table.  It will show an error message if something goes wrong.  If you receive an error message, please let me know what it is and I can investigate it further.  You can also select a specific discussion board for which to load the discussion replies data.

DanL
Community Participant

Oh cool!

I liked the new select menu for certain topics! (unless I completely missed that it was already there before??)

When I select a topic, it loads (albeit, some message bodies display html code).

When I choose "All" it returns:

 Formatting data for table...

 ERROR LOADING DATA: TypeError: Cannot read properties of undefined (reading 'replyCount')

 

Hope this helps!

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

Thank you! Yes, the select menu was a new addition as a way to help with loading times, especially if you only need the information for one or a few discussion boards.

I'm glad to hear it is working for a single topic for you.  I can look into adding an additional column that shows just the text of the message body without the HTML code.  This way you can still have the HTML version if it is needed for other API calls to modify content or check details in the HTML attributes, but also have a simple text version for easier analysis of the text.

Thank you for sharing the error message you received when trying to load all discussion boards.  It looks like it was able to retrieve all of the data, but something went wrong with the reply counts.  I'll review my code to see if I can find the cause of the problem.

DanL
Community Participant

It really has helped me follow those threads, especially the Author Name link and the ability to re-sort by Created At.

Question: are you simply re-sorting what is currently displaying on the page with JS?  Or is it re-querying the API?

If using the API, what's the key to submitting a "sorting" field to the API?

Thanks again for your incredible work!

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

I'm glad to hear it has been helpful to you with finding what you need.  Currently, I am sorting the data that is loaded in the table.  This way the data only needs to be loaded in via API calls once.  However, I have noticed it can sometimes take a while to update the sort order when there is a lot of data, so I have it in my queue to see if I can improve the way it sorts and updates the view to be more efficient.

Also, I have submitted a bug fix for the error that should be resolved with v5.1.0.  It is currently pending review, but that is usually completed within a couple business days.  It looks like it was caused by deleted posts that didn't have expected information.  For now, I'm ignoring deleted posts, but I may re-evaluate it if Canvas releases an update to provide version history for deleted/edited posts.

DanL
Community Participant

Hey there!

Just tried 5.1.0 and it works!  Loads ALL Discussion Replies just fine!

Nice work!  This is SO COOL!

I hadn't seen all those Course Statistics extended reports - neither had any of my colleagues, who were all blown away by it.  They all had it installed already but hadn't seen/noticed that area.

DanL
Community Participant

Not sure you want this feedback or not, but when loading "Modules Progress Report" for a course, I got:


Getting module progress of student (3 of 47)...

ERROR LOADING DATA: TypeError: studentModulesProgress is not iterable

 

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

I'm glad to hear the bug fix in v5.1.0 resolved the previous issue with the Discussion Replies and you can now load all of the data!

That's also great to hear that your colleagues were blown away when you showed them these new reports that I have been building. 😁  I took a risk placing the reports on the Course Statistics page since it probably isn't visited by most users, but it had a lot of empty space on that page and already had some information that may be useful when auditing details about a course.  As a side note, some of the reports also appear on each Section details page (Course Settings -> Sections tab -> Click a section link).  This way if a course has multiple sections, these reports are able to run just based on the enrollments in that section.

I appreciate you sharing the error with the module progress report.  I'll take a look at that more and try to release a patch by early next week along with some new report updates that I'm working on.  If you notice any other errors or issues with features, please let me know and I will try to release patches in a timely manner.

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

I released a patch in v5.2.0 to fix the loading error on the Modules Progress report.  Please let me know if it is working for you now.

DanL
Community Participant

Sorry for the delayed response... yes!  It appears to be working now!

Thanks for the tip, too, on the Section details page reports! Awesome stuff!

DanL
Community Participant

Hey @Code-with-Ski! I was wondering if I could reach out to you with some questions that aren't necessarily related directly to your tool, but are definitely Canvas development related.

If so, let me know.  I'd appreciate it! -Dan

DanL
Community Participant

I'll go ahead and ask it here, sorry if it's not fully on-topic.

In your experience with the Canvas UI, do you know if there is a RoleID available behind-the-scenes for a Course's People list? (/courses/#####/users)

I'm asking because we're interested in changing what displays when we have a custom Observer role.  The UI always displays Observing: nobody for any Observer role, even though we have labeled it differently.  We've asked support about this and it was (as usual) "sorry, that's how it works - no work arounds. You can submit a feature request".

We're thinking if we can "hook in" (via Canvas JS/themes) to the behind-the-scenes RoleID, we could show a better label.

Thoughts?

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

I don't see an easy way to achieve this with the built in People list design unfortunately.

If you are still looking to do this, you could consider trying to develop a theme customization that does the following:

  • Check the roster table head to identify the column that will contain the Role information.
  • Since the information for the Role ID doesn't appear hidden in the HTML source code, it will require API calls to determine the specific role of users that have an Observer based enrollment if you want to customize it based on specific roles rather than changing it for all Observer based roles.
    • One option is to fetch all Observer Enrollments (or only Observer based enrollments of the role you want to customize). 
    • The other option is to fetch the enrollment details of a user as needed when you are checking each row.
  • You will need to check each row in the table body.  A MutationObserver will be needed to handle when new records are added to the table after scrolling in larger classes.
    • If a row has a class of ObserverEnrollment, then you can check if that user has the role you want to modify.
      • Either check the enrollments you fetched in bulk, or fetch the enrollments for this specific user if you didn't fetch in advance.
      • The Canvas user ID is part of the ID of the table row.
    • If the user is one that you want to modify the text for then you will need to select the div elements in the table data element that corresponds to the Role column. You will then process over the div elements and change any that are "Observing: nobody" to what you want it to show.  *This may not work if you do actually assign the custom role you made to observe students.

I haven't actually built this, but that is the approach I would try taking to see if I could at least get a proof of concept.  Some additional refinements may be needed through testing.  Due to the need to fetch enrollments, there will potentially be a noticeable change to users as the value gets updated.  To avoid this, you would likely need to replace the loaded in roles information with a loading icon or something before you make any necessary API calls and switch back to the text once you have updated the necessary value(s) within a row.

It is also important to keep in mind that this would only apply to the browser based view of the People page.  If viewing People in the mobile app, you won't be able to adjust this with theme modifications.

 

Jeff_F
Community Coach
Community Coach

@Code-with-Ski  -  this is simply amazing! 

 

allthumbs.jpg

Code-with-Ski
Community Coach
Community Coach
Author

@Jeff_F 

Thank you 😁

muimid
Community Explorer

Thank you @Code-with-Ski for your great work. I've been using your extension for over a year now and it has been great. However, for some reason I have never been able to get the flyout menu to work. Same thing for the SIS import log. The rest of the buttons on the course page and dashboard (as well as within the courses) work great. (I wrote you an email way back last year with this but I appreciate you may have tonnes of work and it may have slipped your mind)

With your (latest?) update, the course code under the course name in the search results is no longer working on the courses page (but works when I check a student's enrolment) and the number of students on the courses page isn't converted to a link to People in the course.

I'm also getting errors from the course statistics page. They all basically read similar to this one: " Getting sections...  ERROR LOADING DATA: TypeError: sections is not iterable.."

We're running a self-hosted instance of Canvas that we installed in March 2021. It still serves us well enough but could this be the reason why some options of the extension do not work? Do you have an older version we could roll back to?

Thank you, and once again receive my gratitude for your very good efforts. Please continue innovating.

Code-with-Ski
Community Coach
Community Coach
Author

Thank you @muimid! I'm glad to know most of the features have been working great for you, but I am sorry to hear that a couple of the features still aren't working.

I will need to look into those errors further to see if I can find the potential cause of the problem.  I may try to add in some additional detailed logging that can be enabled for those features in my next update so that if it still isn't working you could share some more information that would help with identifying the potential problem.  There is a possibility that it has something to do with a self-hosted version from March 2021, but hopefully not if you are keeping it up to date with the latest open-source Canvas releases.

In the meantime, all past releases are listed on GitHub if you would like to download an older version to use while I work on making some additional updates to try to resolve the above issues.

DanL
Community Participant

Hey Code!

Still loving your extensions.  Quick request... could we have a feature that allows direct publish/unpublish from the System Admins course listings?  Instead of having to go into Settings?  Just directly here:

for_code_ski.gif

just a thought!  Thanks again for everything!

Dan

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

Thank you! I'm glad to hear you are still loving the extension 😀

That suggestion sounds like a great idea and if you haven't already, I would recommend submitting this as a Canvas Idea too.  It wouldn't fit with my current browser extension since I am limiting it to GET calls.  However, I may look into making a script for this that could be added to your theme and/or TamperMonkey.

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

I have just posted a blog post about a user script that I developed to bulk publish courses.  Feel free to check it out and let me know your thoughts.  User Script to Bulk Publish Courses 

DanL
Community Participant

Wow!  Already installed and tried in Beta.

Boom! Works! You are brilliant, my friend!

Code-with-Ski
Community Coach
Community Coach
Author

@DanL 

Thank you!  I'm glad to hear you were already able to try it out and it worked for you.