Merge pull request #619 from dodona-edu/feat/docs-course-sections

Document course sections and the course sidebar

Author: bmesuere

en/guides/students/courses/course-sections-en.png

@@ -52,7 +52,7 @@ In addition to the option to navigate to a course yourself and complete the regi
 
 ## Course Components
 
-A course consists of various components. At the top of the course page, you will see the description of a course. Below that, you can see different exercise series, each consisting of one or more exercises.
+A course consists of various components. At the top of the course page, you will see the description of a course. Below that, under the heading `Learning path`, you can see the different exercise series of the course, each consisting of one or more exercises. In larger courses, these series can be grouped into [sections](#sections). On the right, [a sidebar](#the-course-sidebar) gives an overview of all series in the course.
 
 ![Course page with the header card and a series card showing its deadline and exercise table](./course-page-en.png)
 
@@ -83,6 +83,22 @@ In the menu of an exercise series, you will find the following options:
 
 - `Export my submissions`: Downloads a ZIP file containing the submission for each exercise in the exercise series that was used to determine your [submission status](#submission-status) for the exercise (if you have effectively submitted a solution based on which the submission status could be determined).
 
+### Sections
+
+In larger courses, the course administrator can group exercise series into **sections**, for example one section per chapter or per part of the course. A section is displayed on the course page as a header above its series, together with the number of series and learning activities it contains. You can fold a section closed with the `Collapse` button next to its header, which is useful to keep the overview in a long course; click `Expand` to open it again.
+
+![Course page with two sections, each shown as a header with series and activity counts above its series cards](./course-sections-en.png)
+
+
+### The Course Sidebar
+
+On larger screens, the right side of the course page shows a sidebar listing all exercise series of the course, grouped under their section names. Click the name of a series or section in the sidebar to jump to it on the page; while you scroll, the sidebar highlights the series you are currently looking at. In courses with many sections, the sidebar only keeps the section you are reading expanded.
+
+If you are registered for the course, the sidebar also shows a progress bar for each series, with one coloured segment per exercise indicating whether you solved it, attempted it, or have not started it yet. Hover over the progress bar to see the details; the tooltip on the counter next to it reads, for example, `2 of 10 activities solved`. Optional series do not show a progress bar.
+
+![Course sidebar with series grouped under section headers, each series showing a progress bar](./course-sidebar-en.png)
+
+
 ### Submission Status
 
 Your submission status for an exercise from an exercise series is determined **based on the solution you last submitted in the course for the exercise**. If a deadline was set for the exercise series, this is the last submitted solution before the deadline. The status of an individual submission (`Correct`, `Wrong`, `Runtime Error`, ...) is a different concept; those statuses are explained in [Understanding Feedback](../feedback/#submission-statuses). In the exercise series, you will also see an **icon** corresponding to your submission status for the exercise before each exercise. If you click on your submission status for an exercise in an exercise series, you will navigate to the solution used to determine the submission status (if you have effectively submitted a solution based on which the submission status could be determined).

en/guides/students/courses/course-sidebar-en.png

@@ -27,7 +27,7 @@ After making changes, click the finish button in the upper right corner of the p
 
 ## Building a Course
 
-As a course administrator, you can outline a learning path for the course. The learning path is displayed on the course page under the heading `Exercise Series`. You can add exercise series to the learning path, to which you can link exercises. For more explanation about what you can do, see [managing exercise series](../exercise-series-management/).
+As a course administrator, you can outline a learning path for the course. The learning path is displayed on the course page under the heading `Learning path`. You can add exercise series to the learning path, to which you can link exercises, and group those series into [sections](../exercise-series-management/#group-series-into-sections) to structure larger courses. For more explanation about what you can do, see [managing exercise series](../exercise-series-management/).
 
 ## Managing Course Users
 

en/guides/students/courses/index.md

@@ -7,7 +7,7 @@ order: 5
 # Exercise series management
 
 The learning path of a course consists of various exercise series, each containing different exercises.
-Course administrators can create, edit, delete, and reorder these series.
+Course administrators can create, edit, delete, and reorder these series, and group them into [sections](#group-series-into-sections).
 
 ## Create an exercise series
 
@@ -76,6 +76,25 @@ By default, they will be sorted in reverse chronological order based on when you
 This way, students will always find the most recent series at the top, and thus have to scroll less to find the latest exercises.
 In the series management panel, you can reorder the series by dragging the hamburger icon on the left side.
 
+## Group series into sections
+
+The learning path of a large course can become quite long. To give it more structure, you can group series into **sections**: named groups of series, for example one section per chapter or per part of the course. On the course page, each section is displayed as a header above its series, showing how many series and learning activities it contains, and students can collapse a section they are done with. The sidebar on the right of the course page groups the series per section as well, so students can jump straight to the part they are working on. The [courses guide for students](/en/guides/students/courses/#sections) describes what this looks like on their side.
+
+To create a section, go to the `Manage series` page and click the `Add section` button below the table. A new section named `New section` appears at the bottom of the list, with its name selected so you can immediately type the name you want. To rename a section later, click its name in the table and type the new name; it is saved as soon as you press Enter or leave the field.
+
+![Manage series page with a section row above its series rows, and the Add section button below the table](./manage-series-sections-en.png)
+
+
+Sections and series form a single list on the `Manage series` page, and the hint above the table explains how they relate: `Drag the handles to reorder. Series belong to the section above them.` So to move a series into a section, drag it below that section's header; to take it out of any section, drag it above the first section header. Series above the first section header simply appear at the top of the course page, outside any section, so you can freely combine grouped and ungrouped series. The series and activity counts next to each section name update while you drag.
+
+Each section row also has an `Add series` button, which creates a new series directly in that section. And on the course page of a course that has no series yet, you will find an `Add a section` card to create your first section from there.
+
+A section without series is only visible to course administrators: on the course page, they see it with the message `This section has no series yet.` and a `New series` button, while students do not see it at all. Students also never see a section whose series are all hidden from them.
+
+![Empty section on the course page, visible only to course administrators, with the "This section has no series yet." message and a New series button](./section-empty-en.png)
+
+To delete a section, click `Delete section` on its row on the `Manage series` page. As the confirmation dialog says, the series in it will not be deleted: they only lose their grouping and stay in the course.
+
 ## The series menu
 
 At the bottom of the series, you will find some useful actions that course administrators can perform on the series.

en/guides/teachers/course-management/index.md

@@ -11,7 +11,7 @@ These guides cover everything you need as a teacher, from your first sign-in to
 
 1. [Getting started](./getting-started/): an end-to-end quickstart, from signing in and requesting teacher rights to a first course with exercises.
 2. [Creating a course](./creating-a-course/): start from an empty course or copy an existing one, and control how students register.
-3. [Exercise series management](./exercise-series-management/): build the learning path of your course by creating series and filling them with exercises.
+3. [Exercise series management](./exercise-series-management/): build the learning path of your course by creating series, filling them with exercises, and grouping them into sections.
 4. [Series settings](./series-settings/): a reference for all series settings, including deadlines, visibility, and secret links.
 5. [Series export and retest](./series-export-and-retest/): export the submissions of a series as a zip file or retest them after changing an exercise.
 6. [Assessments and exams](./assessments/): run a test or exam with an assessment series, monitor sessions, and publish the results.