Render default layout in Course Format Plugin (Mobile Support)

Render default layout in Course Format Plugin (Mobile Support)

by Sarah Cheaib -
Number of replies: 4

I am trying to create the mobile support for a course format plugin. I use the Delegate CoreCourseFormatDelegate for this. 


Is it possible to use this delegate to just display the default mobile layout of the Course Page and then maybe just modify it with hooked in JavaScript? 

I wonder how to implement still showing the default mobile frontend Course Page View from the mobile app code 3.5.0 and not use an own template, right now I am rendering the content with a mustache template in the Web Service Callback.

 return array(
    'templates' => array(
        array(
            'id' => 'main',
            'html' => $OUTPUT->render_from_template('format_flex_eduwerkstatt/simple_mobile_course_format', $data),
        ),
    ),
);

Thank you,

Sarah

Average of ratings: -
In reply to Sarah Cheaib

Re: Render default layout in Course Format Plugin (Mobile Support)

by Mark Johnson -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

I've spent quite a bit of time looking at how possible it is to re-use the core course format code for a custom format, and the simple answer is that you can't, aside from being able to use ionic and some core components and directives.

Average of ratings: Useful (1)
In reply to Mark Johnson

Re: Render default layout in Course Format Plugin (Mobile Support)

by Sarah Cheaib -

Thanks Mark, I've been trying to do the same and failed with most part of the code so I guessed it's not possible. I'll have to rebuild the core course format with PHP and then mustache as u mentioned in another thread also. 


What I still don't get is, why the Delegate CoreCourseFormatDelegate has those options 

  • canviewallsections
  • displaysectionselector

when the selector will never show anyway when using the Delegate and having to render the template ourself?



Average of ratings: -
In reply to Sarah Cheaib

Re: Render default layout in Course Format Plugin (Mobile Support)

by Mark Johnson -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

I was wondering this too.  I've just worked out that this controls whether the section selector is available through the menu at the top-right of the course page (which also has options for enabling section downloads, downloading the whole course, and viewing the course summary).  This is separate from the template you provide for your course format. 

Presumably selecting a section here (if its enabled) will set selectedSection in the javascript data that's available to your template.

Average of ratings: -
In reply to Mark Johnson

Re: Render default layout in Course Format Plugin (Mobile Support)

by Mark Johnson -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

A bit of an update on this, while you can't just reuse the whole template, you can reuse the core-course-module component which can save you a lot of time.  This very basic example will give you a list of all the course modules from all sections, you can copy more from the core-course-format component's template in the app if you want.

    <ng-container *ngFor="let section of sections">
            <ng-container *ngFor="let module of section.modules">
                <core-course-module *ngIf="module.visibleoncoursepage !== 0" [module]="module" [courseId]="course.id" [downloadEnabled]="downloadEnabled" (completionChanged)="onCompletionChanged()"></core-course-module>
            </ng-container>
    </ng-container>
Average of ratings: -