All tutorials about showing progress as a percentage have the same limitation: you need to view the course in a linear way, no branching or other non-linear navigation. Even in the TOC the indicated Time at the bottom is supposing you are in a linearly visited course. In the TOC the checkmarks at the slides are the only way to see which slides have been visited in a non-linear course, there is no real progress indicator. Recently someone asked (again) for a progress indicator (percentage) that would be functional in a non-linear course.
I have created two possible solutions, All is slide-based, which is the reason for the two solutions:
- Easiest solution will show the % on each slide, but not after having viewed the slide, but when entering the slide.
- More perfect solution will show the percentage after having viewed the slides. Bit more complicated.
Or you can watch the embedded version (fixed resolution):
Each slide needs a slide tracking variable, user defined of the Boolean type. Its start value is set to 1. Variable names are not important, I labeled them v_1, v_2,…..v_19 because it is easier to link them to the slides. Boring work, sure but I always have a shared action ready in an external library with a bunch of variables and import them using the trick 1 explained in Rare tips for Shared Actions. Each Boolean will be toggled to 1 when visiting the slide for the first time.
Total number of visited slides will be stored in another user variable v_total, also starting with 0 as value.
The percentage viewed slides, which is displayed in a text shape (red), inserted on the first slide and timed for the rest of the project, is stored in the user variable v_perc.
The system variable cpInfoSlideCount will be used as well,which stores the total number of slides.
Events – Shared Action ‘CalcPerc’
That shared action is triggered 19 times, with the On Enter event of the slides:
The Shared Action is straightforward and needs only one parameter: the slide tracking variable:
var perc = window.cpAPIInterface.getVariableValue(“v_perc”); window.cpAPIInterface.setVariableValue(“v_perc”,perc.toFixed(0));
The second solution where the progress will show the percentage viewed slides more correctly will be posted in another article, with its example file.