Advanced Fluid
1 like3,756 views
The document provides an overview of Advanced Fluid, an open source templating language for PHP. It discusses basic ingredients like object accessors and view helpers. It then covers more advanced features such as forms, partials to remove duplication, security protections, and developing custom view helpers and widgets. The goal of Advanced Fluid is to inspire people to share knowledge about this templating language.
More Related Content
Similar to Advanced Fluid (20)
More from Sebastian Kurf¨¹rst (9)
Advanced Fluid
- 1. Inspiring people to Advanced Fluid share
- 2. Advanced Fluid 2. October 2010 Sebastian Kurf¨¹rst <sebastian@typo3.org> Bastian Waidelich <bastian@typo3.org>
- 3. ttp://www.sxc.hu/photo/816749 Basic Ingredients
- 4. Variables $this->view->assign(¡®blogTitle¡¯, $blog->getTitle()); <h1>The name of the blog is: {blogTitle}</h1> Inspiring people to Advanced Fluid share
- 5. Object Accessors $this->view->assign(¡®blog¡¯, $blog); <h1>The name of the blog is: {blog.title}</h1> Author: {blog.author} Getters are called automatically can be nested Inspiring people to Advanced Fluid share
- 6. ViewHelpers Namespace Output logic is encapsulated in View Helpers (Tags) Declaration {namespace f=F3FluidViewHelpers} v5 <f:link.action action=¡°someAction¡°>Administration</f:link.action> Invocation of v4 {namespace f=Tx_Fluid_ViewHelpers} a tag <f:link.action action=¡°someAction¡°>Administration</f:link.action> Namespace f is included automatically Inspiring people to Advanced Fluid share
- 7. Arrays <f:link action=¡°show¡° arguments=¡°{blog: blog, name: ¡®Hello¡¯}¡°>show posting</f:link> JSON object syntax objects as arguments can be used! Inspiring people to Advanced Fluid share
- 8. Summary: Basic Ingredients Object accessors: {blog.title} ViewHelpers: <f:for each=¡°{blog.posts}¡° as=¡°post¡°>...</f:for> Arrays Inspiring people to Advanced Fluid share
- 9. http://www.?ickr.com/photos/sackerman519/4248877127/ Advanced Features
- 10. Forms - Edit Blog Post object bound to form <f:form action="update" object="{post}" name="post"> <label for="author">Author</label><br /> <f:form.textbox property="author.name" /><br /> <label for="title">Title</label><br /> <f:form.textbox property="title" /><br /> <label for="content">Content</label><br /> <f:form.textarea property="content" rows="5" cols="40" /><br /> </f:form> property binding Inspiring people to Advanced Fluid share
- 11. Forms - New Blog Post Used on Validation Error <f:form action="create" object="{newPost}" name="newPost"> <label for="author">Author</label><br /> <f:form.textbox property="author.name" /><br /> <label for="title">Title</label><br /> <f:form.textbox property="title" /><br /> <label for="content">Content</label><br /> <f:form.textarea property="content" rows="5" cols="40" /><br /> </f:form> Inspiring people to Advanced Fluid share
- 12. Cod e <f:form action="update" object="{post}" name="post"> <f:form action="create" object="{newPost}" name="newPost"> Dup <label for="author">Author</label><br /> <label for="author">Author</label><br /> <f:form.textbox property="author.name" /><br /> <f:form.textbox property="author.name" /><br /> <label for="title">Title</label><br /> <label for="title">Title</label><br /> lica <f:form.textbox property="title" /><br /> <f:form.textbox property="title" /><br /> <label for="content">Content</label><br /> <label for="content">Content</label><br /> tion <f:form.textarea property="content" rows="5" cols="40" /><br /> <f:form.textarea property="content" rows="5" cols="40" /><br /> </f:form> </f:form> !
- 13. Removing the Duplication <f:form action="create" object="{newPost}" name="newPost"> <f:render partial="BlogPostForm" /> </f:form> Resources/Private/Partials/BlogPostForm.html <label for="author">Author</label><br /> <f:form.textbox property="author" /><br /> <label for="title">Title</label><br /> <f:form.textbox property="title" /><br /> <label for="content">Content</label><br /> <f:form.textarea property="content" rows="5" cols="40" /><br /> Inspiring people to Advanced Fluid share
- 14. Use Partials to remove Duplication Ausstecher-bild Partials remove duplication
- 15. XSS Improving the Edit Form <h2>{post.title}</h2> ? <f:form action="update" object="{post}" name="post"> <f:render partial="BlogPostForm" /> </f:form> Inspiring people to Advanced Fluid share
- 16. Improving the Edit Form <h2><script> stealSessionAndSendTo('evil@drupal.org')</script></h2> <f:form action="update" object="{post}" name="post"> <f:render partial="BlogPostForm" /> </f:form> Inspiring people to Advanced Fluid share
- 17. Improving the Edit Form <h2>{post.title}</h2> <f:form action="update" object="{post}" name="post"> <f:render partial="BlogPostForm" /> </f:form> Automatically Escaped! Inspiring people to Advanced Fluid share
- 18. Secure by Default
- 19. Improving the Edit Form <h2>{post.title}</h2> <f:format.date format="Y-m-d">{post.date}</f:format.date> <f:form action="update" object="{post}" name="post"> <f:render partial="BlogPostForm" /> </f:form> Inspiring people to Advanced Fluid share
- 20. Improving the Edit Form <h2>{post.title}</h2> {post.date -> f:format.date(format:"Y-m-d")} <f:form action="update" object="{post}" name="post"> <f:render partial="BlogPostForm" /> </f:form> Inspiring people to Advanced Fluid share
- 21. Tag Syntax vs Inline Syntax <link rel="stylesheet" href="<f:uri.?le path='myStyle.css' />" /> <link rel="stylesheet" href="{f:uri.?le(path: 'myStyle.css')}" /> Both have their use-cases! Inspiring people to Advanced Fluid share
- 22. Don't fear the Inline Syntax! Sushi-Bild sxc.hu: 1097400_18260778.jpg
- 23. Inspiring people to Advanced Fluid share
- 24. Render Date as Image <h2>{post.title}</h2> {post.date -> f:format.date(format:"Y-m-d") -> f:cObject(typoscriptObjectPath: 'lib.dateAsImage')} TypoScript lib.dateAsImage = IMAGE lib.dateAsImage { Use TypoScript where it makes ?le = GIFBUILDER ?le { 10 = TEXT } } 10.current = 1 sense. Inspiring people to Advanced Fluid share
- 25. Summary: Advanced Features Forms XSS Protection Inline Syntax cObject ViewHelper Inspiring people to Advanced Fluid share
- 26. ToDo: Developing ViewHelpers -> Bild vom Kochen / Backen? MESSERBLOCK / Messer an wand Developing ViewHelpers http://freerangestock.com/details.php?gid=37&pid=11545
- 27. Fluid Core does not contain any output logic, and no control structures!
- 28. <f:...> Every tag is a class!
- 29. v5 {namespace f=F3FluidViewHelpers} <f:for>...</f:for> F3FluidViewHelpersForViewHelper
- 30. v4 {namespace f=Tx_Fluid_ViewHelpers} <f:for>...</f:for> Tx_Fluid_ViewHelpers_ForViewHelper
- 31. v4 {namespace f=Tx_Fluid_ViewHelpers} <f:link.action>...</f:link.action> Tx_Fluid_ViewHelpers_Link_ActionViewHelper
- 32. AbstractViewHelper AbstractTagBasedViewHelper AbstractConditionViewHelper AbstractWidgetViewHelper Inspiring people to Advanced Fluid share
- 33. AbstractViewHelper {namespace blog=Tx_BlogExample_ViewHelpers} <blog:greeting name="Kasper" /> class Tx_BlogExample_ViewHelpers_GreetingViewHelper extends ...AbstractViewHelper { /** * @param string name */ public function render($name) { return 'Hello ' . $name; } } Inspiring people to Advanced Fluid share
- 34. Example: <f:image src=/skurfuerst/advanced-fluid/"myImage.png" width="200" /> With AbstractViewHelper: public function render($src) { XSS return '<img src="' . $src . '" />'; // TODO: Scaling } Advanced Fluid ! Inspiring people to share
- 35. TagBasedViewHelper Example: <f:image src=/skurfuerst/advanced-fluid/"myImage.png" width="200" /> With TagBasedViewHelper: protected $tagName = 'img'; public function render($src) { $this->tag->addAttribute('src', $src); return $this->tag->render(); } Inspiring people to Advanced Fluid share
- 36. TagBasedViewHelper Additional Goodies Default Arguments: class, id, style, ... additionalAttributes <f:form.textbox additionalAttributes="{dojoType: 'dijit.form.TextBox'}" /> Inspiring people to Advanced Fluid share
- 37. IfViewHelper <f:if condition="{blog.posts}"> <f:then> ... display blog posts ... </f:then> <f:else> No Blog Posts Available </f:else> </f:if> <li class="{f:if(condition: iteration.isFirst, then: 'isFirstElement')}">Some Element</li> Inspiring people to Advanced Fluid share
- 38. IfViewHelper class IfViewHelper extends ...AbstractConditionViewHelper { /** * @param boolean $condition View helper condition */ public function render($condition) { if ($condition) { return $this->renderThenChild(); } else { return $this->renderElseChild(); } } } Inspiring people to Advanced Fluid share
- 39. Widgets Inspiring people to Advanced Fluid share
- 41. Sortable g rid nd ar Ca le a ti on ag in AJAX P Autoco mpleti on Widgets encapsulate complex (view-related) functionality. Alph ps abe le Ma tica l lis Go og ting Inspiring people to Advanced Fluid share
- 42. It's simple to use them! Inspiring people to Advanced Fluid share
- 43. It's simple to write them! Inspiring people to Advanced Fluid share
- 44. http://www.sxc.hu/photo/983682 Creating ViewHelpers is easy!
- 46. TA Inspiring people to Advanced Fluid share
- 47. Autocompletion Inspiring people to Advanced Fluid share
- 48. Autocompletion Inspiring people to Advanced Fluid share
- 49. ???? ?? ?? ? ?? ? ? Inspiring people to Advanced Fluid share
- 50. inspiring people to share.