Flow/Epic Front-End
 | This page is obsolete. It is being retained for archival purposes. It may document extensions or features that are obsolete and/or no longer supported. Do not rely on the information here being up-to-date. A more up-to-date description of how the redesigned code works can be found at Flow/Templating |
The Flow team is working on revised front-end code (browser CSS, HTML, and JavaScript) for Flow, codename "Epic Front-End".
The new version of Flow using it is in the frontend-rewrite branch.
It has possible features of
floating Table of Contents on the right for navigation and indicating progress on the boarddropped from first sprint- Agora enhancements (all in local code, some proposed for core)
- revised Agora button styling
- new drop-down menu replaces flyout menu
- new Agora colored tooltip
- Design/WikiFont for symbols
- remembers stat, e.g. user's choice of regular/collapsed/small view of topics on the board.
- new sort by Recent active topics as well as default by Newest topics.
Implementation
[edit]Templating
[edit]The new front-end uses handlebars.js on the client to render templates supplied by ResourceLoader, and lightncandy in PHP to render the same templates pre-compiled at commit-time. Tracking bug 63443, security review is bug 63445. WMF will likely standardize on a templating library similar to Knockout but the PHP implementation is not ready yet.
Jon Robson has moved this into a separate Extension:Mantle, that page has some documentation on how to use it. Extension:MobileFrontend uses similar "Hogan" client-side templates, only in its JavaScript front-end.
See Flow/Architecture/Templating for Flow's approach to handlebars, helper functions, adding JS interactivity, etc.
Earlier
[edit]A rough prototype HTML-only prototype is at http://area51.yar.gs/wmf/flow1/ , not connected to any back-end. The code for now is at https://github.com/shahyar/wmf-flow1 , project tracking in Trello