Exporting assignment description pages

[DanielHOWE]

I have a number of course for which I need to export or otherwise download the assignment brief pages (the descriptions of the assignments, NOT the submitted student assignments). How can I do this ? I'd like them to be saved in some human-readable, and (ideally) editable format, like Word, or PDF, without requiring an LMS.

Each course has 10-20 assignments and there are about 20 courses.

[James · Accepted solution]

@DanielHOWE 

Add /graphiql to the end of your Canvas dashboard URL. This opens the graphQL explorer.

In the middle section, paste this code. Change the 3903130 to the Canvas ID for your course.

query assignmentDescriptions {
  course(id: "3903130") {
    assignmentsConnection {
      nodes {
        name
        description
      }
    }
  }
}

After changing the course ID, click the Run (black triangle in a circle) button at the top.

The output will appear on the right side.

It will be in JSON format containing the name and assignment description of the assignment. The description will be in HTML format.

It looks something like this.

{
  "data": {
    "course": {
      "assignmentsConnection": {
        "nodes": [
          {
            "name": "Public Transit Data",
            "description": "<p>This assignment is part of the <a title=\"Public Transit\" 
... whole bunch of lines removed for brevity ...
towards your grade or have any impact other towards earning a badge.</p>"
          }
        ]
      }
    }
  }
}

Now we need to convert it into a usable and readable format.

Select all of the text starting with the left bracket [ after the "nodes": at the top and all the way through the bottom up to and including the closing right bracket ]. Do not include the four closing right braces } at the bottom.

Copy that text.

Now go to some tool that will convert JSON to HTML. I found one at Code Beautify, but there are likely others.

For the Code Beautify converter, you put your JSON in the left side and click Convert to HTML. You can then select and copy the output and then paste it into a Word document. Don't click the Copy button at the top right, it copies the HTML code, not the output. You can also download it as an HTML file and open with a browser (you could then print to a PDF or do whatever you want to with it).

It doesn't have the Canvas styling that goes along with things, but it does get you all of the assignment descriptions really quickly without having to go through each one individually.

Edit: clarified how far to select when copy/pasting the output.

[paul_fynn]

"Right Click" on the Assignment then select "Print".

One of these areas where it might be nice to have a print option on screen across Canvas assets....

[DanielHOWE]

This would take about a week for 400 assignments

[Chris_Hofer]

Hi @DanielHOWE ...

If you are an instructor, you could export your course to a *.imscc file.

How do I export a Canvas course?

Then, after you download that file, you can change the extension on the file to a *.zip format.  Next, unzip the folder, and then open up the exported zip folder on your computer.  You're going to see a bunch of folders that have a long series of number and letters.  Most of these are the individual assignments in your course...and you're going to have to go into each folder to see exactly which assignment it is.  Within each of these folders are two files...one of which is the name of the assignment in your course (the other is labeled "assignment_settings").  If you open up the other file, it will probably open up within your browser, but you should be able to open up the file in something like MS Word as well.  I just tried this with my own sandbox course and MS Word on my laptop, and it worked as expected.

I hope this will help a bit.  Sing out if you have any questions...thanks!

[DanielHOWE]

I did try this approach, however a) you get folders/files without meaningful names and b) there is no css, so the display is not good. But at least this approach works for all assignments in a course, rather than one by one...

[James · Accepted solution]

@DanielHOWE 

Add /graphiql to the end of your Canvas dashboard URL. This opens the graphQL explorer.

In the middle section, paste this code. Change the 3903130 to the Canvas ID for your course.

query assignmentDescriptions {
  course(id: "3903130") {
    assignmentsConnection {
      nodes {
        name
        description
      }
    }
  }
}

After changing the course ID, click the Run (black triangle in a circle) button at the top.

The output will appear on the right side.

It will be in JSON format containing the name and assignment description of the assignment. The description will be in HTML format.

It looks something like this.

{
  "data": {
    "course": {
      "assignmentsConnection": {
        "nodes": [
          {
            "name": "Public Transit Data",
            "description": "<p>This assignment is part of the <a title=\"Public Transit\" 
... whole bunch of lines removed for brevity ...
towards your grade or have any impact other towards earning a badge.</p>"
          }
        ]
      }
    }
  }
}

Now we need to convert it into a usable and readable format.

Select all of the text starting with the left bracket [ after the "nodes": at the top and all the way through the bottom up to and including the closing right bracket ]. Do not include the four closing right braces } at the bottom.

Copy that text.

Now go to some tool that will convert JSON to HTML. I found one at Code Beautify, but there are likely others.

For the Code Beautify converter, you put your JSON in the left side and click Convert to HTML. You can then select and copy the output and then paste it into a Word document. Don't click the Copy button at the top right, it copies the HTML code, not the output. You can also download it as an HTML file and open with a browser (you could then print to a PDF or do whatever you want to with it).

It doesn't have the Canvas styling that goes along with things, but it does get you all of the assignment descriptions really quickly without having to go through each one individually.

Edit: clarified how far to select when copy/pasting the output.

[ProfessorBeyrer]

@James that solution is amazing! I found, @DanielHOWE, that when I copied and pasted the content of the Result window into an MS Word document, the extended table included also formatted the top row as a header that appears at the top of each page. I also noticed that the New Quizzes in my course are included in the table but not the "description." That's likely because the New Quiz "Instructions" are within the LTI interface and New Quizzes does not have a description/instructions field like classic quizzes, assignments, and graded discussions do.

[James]

@ProfessorBeyrer -- people use New Quizzes???

I tried grabbing descriptions from the REST API but they're not there for new quizzes, either. That's good because they didn't need to be there in the REST API anyway (this is why the GraphQL is so much faster).

Canvas has been adding some New Quiz functionality to the API (just not the Graph QL

There is an API call to list the New Quizzes.

Let's say that I have a sandbox course that has some New Quizzes in it. The course ID is 2517260. My actual teaching course doesn't have any New Quizzes.

If you don't want to mess with PostMan or some other REST client, you can append this request to the end of the dashboard URL. Again, change the 2517260 to your course number.

/api/quiz/v1/courses/2517260/quizzes?per_page=100

If there are more than 100 New Quizzes in a course, you'll have to mess with pagination.

The names of the properties are different than regular assignments. The name is called title and the description is called instructions.

[
  {
    "id": "38311706",
    "title": "CH3 Q2 New Quizzes",
    "instructions": "<p>Read the following before attempting this quiz.
... a bunch of stuff removed ...
  }
]

You can then copy/paste this (the whole thing) into a JSON to HTML converter, but the only two fields you'll want are the title and instructions. There are a lot of other fields there that you don't want.

I didn't want to get overly technical with the explanation. That's why I didn't talk about opening the developer tools, looking and the response for the network tab, storing it to a temporary response and then running an array map on the results to filter just the relevant information.

If I had to do this for myself, I would definitely write some code to do it. It would take a course ID, download both the GraphQL and the New Quizzes results, strip out any unnecessary fields, fancy it up -- maybe make a H1 heading for the name/title and then add the description/instructions underneath it. That could be displayed where you could then copy/paste it into something (like a Word document).

[ProfessorBeyrer]

Thanks @James. It's probably true that the challenge of the missing "instructions" also applies to other assessments created using LTI tools. 

Yes, a New Quizzes user here! I'm overall happy with it and am willing to dance on the bleeding edge. I get cut occasionally but so far my students haven't.

[DanielHOWE]

This is an excellent solution @James. A few questions/problems:

1) some, but not all image links are broken - for example, URLs in the form of https://LMS/courses/528634/files/11651607/preview

2) is it possible to fetch ALL created pages for the course (for example, in addition to 'assignments' I have a page on 'grading', a page on 'conduct', a page on 'schedule', etc.)

3) is it possible to supply multiple course ids for a single query ?

[James]

@DanielHOWE 

You just made the task a lot harder.

1. If you have images within the descriptions and want the formatting to make it look like Canvas, then you will need to use a browser, visit each assignment, and print each item. Canvas wasn't designed for printing, so it looks terrible (my opinion). All of the URLs are shown in the printout next to the link. You may want to look into one of the solutions that disables the printing of URLs. I've got two userscripts I wrote that do this: Hide URLs and Canvas CSS Tweaks.
2. It is possible to fetch all page within the course, but you will need to do it one at a time. Pages use the REST API not GraphQL and there is a Pages API that will give you a list of pages, but then you will have to iterate through each page and fetch them one at a time. This will suffer from the same issue as the assignments as far as look and images. It will not look like Canvas. The API will just return the HTML that gets displayed within Canvas, but Canvas supplies all the formatting.
3. The queries only support on course ID at a time.

With the number of pages and assignments that you have to do, you may want to look into some kind of automation. This will require programming skills and I don't know your skill set. I've used Puppeteer before, which is (loosely) Chrome that you can program using JavaScript. You can tell it where to click, which page to load, even to save a page to a PDF file. They have a headless version that can run in the background without showing what it's doing, but I would use the regular version for this so that you can quickly log in to Canvas, go to the course you want, and then run the automation.

Puppeteer isn't the only solution out there, just the one I've used most recently and it works well because I know a little bit about JavaScript.

[DanielHOWE]

Thanks @James -- I was also thinking about scripting it with puppeteer or selenium, but hoping for a quicker/easier solution. A question: any idea why some of the images display correctly when I convert the JSON to HTML, while others show up as broken links ? Also, are there docs somewhere detailing which course elements are available via graphQL vs the pages API ? cheers!

[James · Accepted solution]

@DanielHOWE 

My initial thought, when I read your message earlier, is that the images within Canvas are the ones not showing up. You have to be logged into Canvas to access those. Those that are external are not behind a login and can be displayed when you convert it.

The graphQL documentation is contained within the explorer when you add the /graphiql to the end of the URL. Try to find it and if you cannot, it may not be there. The REST API documentation is much more thorough.

I find graphQL harder to work with, but I'm not using a library to process it. But when it is available, it is a lot quicker and doesn't deliver a bunch of stuff I don't need. If I'm lucky, I can use it the way it's intended and pull from several different objects at once, minimizing the number of calls. There is a 30 second timeout rather than worrying about how many calls you've made too quickly, which allows me to fetch most of what I want within a single course without having to worry about pagination.

Now the sad news. You can get data from the REST API, GraphQL, Canvas Data 2, and Canvas Data Services Live Events. The last two require extra work and may involve someone with admin rights to set up. Some pieces of information are only available using one approach, some can be obtained from all, or it could be anywhere in the middle. Occasionally, there are still things you want that cannot be obtained anywhere.

A full solution without Puppeteer/Selenium would involve downloading the CSS and storing it locally so that you can make the styles match. Then download all the titles and descriptions for pages, assignments, New Quizzes, etc. Scan those for any internal images and use the Files API to download those and store them locally. Look for any non-Canvas images and store those locally. Then generate an HTML page linked to the CSS, contained the information and referenced the local version of the images. If you wanted, you could take the HTML and convert it to PDF.

There are a couple of options that you might want to look at and see if it can work for you. 

The first is exporting each module as an HTML file. My institution doesn't enable offline web support, so I cannot test what this gives you. It's explained in the How do I view course content offline as an HTML file as a student lesson. That is module specific, though, and if you can get it to work at all, you would need to download each module separately.

Another option, which has to be enabled as the "ePub Exporting" feature, is to download an ePub file of the entire course. There is also an option on the Course > Settings page about whether to organize by module (default) or type. How to create the ePub document is explained in How do I view course content offline as an ePub file as a student? When you generate the ePub, it says "Downloading course content allows access to content while offline. Content may include files, pages, assignments, discussion topics or quizzes. Click "Generate ePub" for each course and open with any eReader software to view."

I'm using my beta instance to generate an ePub for my stats class. Probably a bad idea. It's a large class (document wise) and it's not organized by modules, so I will likely not get what I wanted when it's done. It's been 10 minutes and I'm at about 10%. It should be faster in the production instance. I have other things to work on, so I'll probably leave it up to you to see if it will work for you.

Even if the ePub format isn't acceptable as it comes, there might be utilities that would allow you to extract content from it.

[Chris_Hofer]

@James ...

I agree with @ProfessorBeyrer ...this is amazing!  I've never tried this before, but totally gonna show this to my supervisor tomorrow!