How to add a completion mark to all the activities?

How to add a completion mark to all the activities?

by Pat Sej -
Number of replies: 9
Hi everyone,

I'd like to add a completion icon (green check mark) to all the activity headers to help the user know that the activity is done.
For instance, I'd like to have this icon on the same line as the title of a page module.

Is it possible to do it in the theme itself (without changing Moodle's code in mod/page/) ?

At the moment I'm on Moodle 3.4 but I can upgrade to 3.6 if mandatory.

Thanks in advance!

Cheers,
Patrice
Average of ratings: -
In reply to Pat Sej

Re: How to add a completion mark to all the activities?

by Melanie Scott -
Picture of Particularly helpful Moodlers

You could add a label to the top of each section that only appears when all requirements in the section are complete. Sections don't have completion criteria.

Average of ratings: Useful (3)
In reply to Melanie Scott

Re: How to add a completion mark to all the activities?

by Pat Sej -
Thanks for your answer.

I forgot to precise that my theme is set to show activities on a separate page from the section. They don't appear below it.
The user navigates with Previous / Next buttons / Table of content (like in Coursera, Lynda, ...)

When a user comes back (potentially a long time after), he wants to know what he has already done.
He therefore needs to have a mark on each activity & section he finished and also in the Table of content.

BTW in addition, the best would be to also put him back on the last page he visited.

Is there a way to add a completion mark within the activity page (like mod/page or h5p, ...) without modifying Moodle core?

Cheers wink
In reply to Pat Sej

Re: How to add a completion mark to all the activities?

by Matt Donnelly -
Hi Patrice, do you mean something like this?

activity title with green checkmark

I just mocked this up in Chrome's inspector, so it's just an example and not an implementation. One thing I thought of was if the activity completion requirement was based on "Require view", a checkmark would always show because that requirement is checked and fulfilled prior to output being sent (if I remember the process correctly). If you still wanted to implement it, you could try a web service function in your theme that just checks the activity completion status for the current user and appends a check to the h2 of the page title via JavaScript, or possibly a filter plugin. 
Average of ratings: Useful (1)
In reply to Matt Donnelly

Re: How to add a completion mark to all the activities?

by Pat Sej -
Hi Matt,

Thanks for your answer!

Yes that would be exactly that also on the activity pages (as I wrote Melanie).
Would you have an example of code to achieve that ?
In which class should it be implemented in a theme?

Your version looks good by the way big grin

Cheers wink
In reply to Pat Sej

Re: How to add a completion mark to all the activities?

by Melanie Scott -
Picture of Particularly helpful Moodlers

I could be wrong, but I think he added the check to the title of the section that only displays under certain conditions (theme web service things). I know very little about web service things or java or...well techy stuff.

I'm not sure i understand the theme you describe. Is it like the Grid format or One Topic? If it actually creates a new page vs displaying a topic, you could do something like that where the page you show changes based on completion criteria (if you don't use the standard activity topics), create two areas, on with a check and one without...then only show the one with a check when the condition is met and hide the one without...Heck, you could do that with Grid or one topic, just hide the original and display the new and just create web links to the activities rather than a copy of the topic.

In reply to Melanie Scott

Re: How to add a completion mark to all the activities?

by Pat Sej -
Hello Melanie,
I've just noticed I did not reply.
Thanks for your answer wink
In reply to Pat Sej

Re: How to add a completion mark to all the activities?

by Matt Donnelly -

Hi Pat, here is a very basic idea of how I would do it, it's a theme you can install and test inside a course:

https://github.com/deukalion-io/checkmark

Essentially I:

  1. made a skeleton child theme of boost
  2. made a layout/template called 'incourse' for inside a course, and called the javascript file in it
  3. made a simple webservice in db/settings.php and externallib.php that checks if the current user has completed the current page, and appends a checkmark to the h2 if true. 

It's by no means polished but I think it illustrates some concepts. 

Average of ratings: Useful (2)
In reply to Matt Donnelly

Re: How to add a completion mark to all the activities?

by Matt Donnelly -
Two things to add: 
  1. I put animate.css in the Additional HTML to create a nice fade-in (see the classes on the checkmark)
  2. If you want to add checkmarks to the course home page (where all sections are displayed at once like the picture below, that involves a custom course format that uses mustache templates, so it's another project on its own. I don't know my workplace policy for sharing code but if they let me publish it I'll let you know.

screenshot of course home page

Average of ratings: Useful (2)
In reply to Matt Donnelly

Re: How to add a completion mark to all the activities?

by Pat Sej -
Hello Matt,
I've just noticed I did not reply.
Thanks for your answer! wink