LiNC Developer Meetup

1. LiNC Developer Meetup Welcome!

2. Lithium Developer Network • Our job is to make your life easier • APIs • Tools and workflow • Documentation • Stay in touch: developers.lithium.com • Join the Developer Track at LiNC • May 20-22, San Francisco

3. Freemarker: Rest and Other Context Object A look at the powerful tools you can access through freemarker Doug Schroeder and Yuri Kapulkin

4. REST How to make and use REST calls in freemarker components and endpoints

5. REST • The rest directive can be used to call the Lithium REST API • Rest calls return a W3C.Node context object with the response from call • If you compare the XML response in a browser to the W3C.Node object, the only difference is it doesn’t contain a “response” wrapper • So you don’t have to do .response • To get an attribute use @ sign • To check if an attribute exists use node.attribute[0]?? • To get nodes, use . Notation • Examples: • ${rest(“/messages/id/5”).message} • ${rest(“/messages/id/5”).message.@href[0]??} • ${rest(rest(“/messages/id/5”).message.board.@href)}

6. How to parse the DOM • Imperative • http://freemarker.org/docs/xgui_imperative.html • Declarative • http://freemarker.org/docs/xgui_declarative.html • Builtins • http://freemarker.org/docs/ref_builtins_node.html

7. Querying the Community How to get community data into your components

8. CoreNode Context Object • Use when dealing with pages that represent lower level nodes in the community structure • Category page • Forum page • etc. • Note: Most pages in the application are community level • Examples: • ${coreNode.id} • <#assign nodeId = coreNode.id/> • Lithosphere: CoreNode Context Object

9. Page Context Object • Use on a page that represents either a message, a user, or a thread • If a page represents a user, you can get details about the user • My Profile Page • User Profile Page • If a page represents a message, you can get details about the message • Message Page • If a page represents a thread, you can get details about the thread • Thread Page • Examples: • Verify the context object exists using if: • <#if page.context.thread??></#if> • ${page.context.thread.topicMessage.uniqueId} • ${page.context.message.uniqueId} • ${page.context.user.id} • Lithosphere: Page Context Object

10. Env Context Object • When you are on a page with a list of messages (such as the topic page), the env object can help to get the id of each message in the list • Forum Message • Idea Message • Etc. • Examples: • ${env.context.message.uniqueId} • <#if env.context.message.parent??>${env.context.message.parent.uniqueId}</#if> • Lithosphere: Env Context Object

11. Localizable Text • Used to render localized text strings • Examples: • ${text.format(“general.Kudos”)} • ${text.format(“text.key.with.arguments”, “arg1”,“arg2”)} • Lithosphere: Localizable Text

12. Lithium Freemarker Directives A look at special directives that can be used in components and endpoints

13. @component • The @component directive allows you to insert components into other components • You can pass parameters to a component using named parameters • Most components don’t have any parameters but some do • You can add parameters to your custom components • Examples: • <#assign threads=rest(“/threads/recent”).threads /> • <@component id=“recent_threads” param_name=threads/> • Retrieve parameters in a component using the following: • <#assign threads=env.context.component.getParameter(‘param_name’) /> • Lithosphere: Passing Parameters to a Component

14. @modal • Modal directive is used to render a component inside of a modal window • You will need to specify the following parameters: • Id: the id of the component you want to render inside the modal • Label: The text to display on the link or button used to open the component • These are the only two parameters required but there are others you can use to further customize the modal • Example: • <@modal id=“my_component_id” label=“my.component.label”/> • Lithosphere: Creating Modal Dialogs

15. @liaAddScript • Lets you specify a block of javascript code in a component • The javascript will be added to any page containing the component • The javascript will be added after all core javascript has run • For jQuery, use Lithium.jQuery instead of $ to use Lithium’s jQuery • You can assign $ to Lithium.jQuery as in the example • Example: • <@liaAddScript> • ;(function($){ • /*your code here*/ • })(Lithium.jQuery); • </@liaAddScript>

16. Calling External Services How to call external services and use them in freemarker

17. Http Client • Http Client allows you to call third party APIs • You can configure what domains are allowed via the Lithium Admin • You can add headers, fragments, cookies, and parameters to the request • Currently HTML is not allowed in the responses and will be rejected! • Examples: • ${http.client.request(“https://some.api.url/some/path”).json().get()} • $eval{(http.client.request(“https://some.api.url/some/path”).get()} • ${http.client.request(“https”,”some.api.url”,”/some/path”).xml().parameter(“paramName”,”paramValue”).post()} • Lithosphere: Http Client

18. Http Client – Parsing the response • You can use response.hasError to check if call was successful • response.error.message will contain the error message • Response.content will contain the content of the response • Examples • <#assign response=http.client.request(“https://someurl”).json().get()/> • <#if response.hasError> • <#-- handle error--> • <#else> • <#-- do cool stuff --> • </#if> • http://lithosphere.lithium.com/t5/developers-knowledge-base/http-client-response-FreeMarker-context-object/ta-p/80622

19. Thanks!