Note: This page is a work-in-progress. Feedback and suggested improvements are welcome. Please join the discussion on moodle.org or use the talk.
| Template Library 3.0 | |
|---|---|
| Project state | In Progress |
| Tracker issue | MDL-50148 |
| Discussion | |
| Assignee | Damyon Wiese |
Overview
This project is a continuation of the improvements to Moodles Rendering system that were started in Moodle 2.9. The end goals are:
- Extensions to the templating engine so that it is easy to create and maintain templates
- A comprehensive set of core templates that can be used by plugin authors to build completely new interfaces in Moodle
- Documentation on best practices for creating and using templates in Moodle
Extensions required to mustache engine
Some things in mustache are overly difficult because of the lack of features in the templating language. This is by design - but the mustache authors have discussed that "presentation logic" is not itself a bad thing and they would make the language more expressive for a 2.0 version. We need to add a few features to mustache so that we can do simple things with less code, and less work required in php.
- Rename variables in a context. This will allow you to re-use a template that was expecting different variable names in the context without requiring any context manipulation in php. MDL-50165
- Add simple conditional logic helpers. It should be easy to do simple things like make the first item in a list bold. MDL-50167
- Blocks support. Blocks are a feature that allow you to use a form of template inheritance. This is critical to writing re-usable templates. MDL-50150
A comprehensive set of core templates
The design of the core templates is critical part of this work. We need a large set of templates that cover all use cases. The source of ideas from templates is taken from many places including previous work Output_element_planning
Template types
The types of templates we are creating can be categorised into 3 simple types.
Page templates
This is the outer most template that will used to render a page. It should build up the interface for the page by including other layout templates and widgets. The naming convention for this type of template is that they should end with "_page". By default we should hide these from the template library - because they are not intended to be reused (it is still useful to show them for theme designers though).
- Page templates are not in the scope of this project, they will be added as needed when we convert existing core pages to a completely template driven page.
Layout templates
A layout template is a template that uses the "blocks" feature. These templates are designed to be included in another template. They define some html structure with sections that are replaced when the template is included. The naming convention for this type of template is that they should end with "_layout".
- Hero
- Gallery
- Menu
- Toolbar
- Tabs
- Media (standard layout for an image followed by text)
- List
- Panel
- Tree
- 2 responsive columns (large, small)
- 2 responsive columns (small, large)
- 3 responsive columns (manual)
- 3 responsive columns (overflow)
- 2 column (right and left aligned) e.g. form
- Bread crumbs
- Block
- Table
- Collapsible
- Dialog
- Notification
- Confirmation
- Forms (built on quickforms, or a new ajax forms)
- Horizontal list (e.g. row of buttons)
Thing templates
A thing template is a template that uses the context data to produce the final HTML for something on the page. This is the default template type, and there is no naming convention for them. They should not be so granular that they represent a single HTML tag - the goal of the template library is not to invent a new language - instead we are creating granular chunks of HTML that can be reused.
- Button
- User picture
- Pix icon
- URL select
- Label
- Divider
- Heading with help
- Pagination
- Progress bar
- Clearfix
- Center
- Search
Note: some of these may end up being layouts, if the implementation makes more sense using "blocks".
Documentation
TODO - needs updating as we learn the best way to write these templates.
