Introduction to Alfresco Dashletsfor beginners

Jordi Vilaplana - Computer Engineer @vjordi gatasuna@gmail.com

http://jordiv.com

What is a dashlet?"A dashlet is an application that appears in the Alfresco dashboard that presents information to the user."

My Sites dashlet

How it works?

Files involved - Naming conventions

To create a dashlet we need to decide three things

● Dashlet's name

● HTTP method used to call the dashlet

● Presentation format for the response

All dashlet files start with the name of the dashlet

Files involved - Naming conventions

Files involved - Naming conventions

● mydashlet.get.desc.xml: Descriptor file

● mydashlet.get.js: Model file, where we put the logic

● mydashlet.get.html.ftl: View file for the presentation

● mydashlet.properties: Properties file

Files involved - One file at a time

mydashlet.get.desc.xml

<webscript> <shortname>My Dashlet</shortname> <description>A dashlet that does nothing</description> <family>user-dashlet</family> <url>/jordiv/components/dashlets/mydashlet</url></webscript>

● shortname: A user-friendly name● description: A short description● family: One of user-dashlet, site-dashlet or dashlet● url: URL used to access the dashlet

Files involved - One file at a time

mydashlet.get.js

function main() { model.name = "Jordi";}

main();

All what we put inside the model variable will be available in the view.

Files involved - One file at a time

mydashlet.get.html.ftl

<script type="text/javascript">//<![CDATA[ new Alfresco.widget.DashletResizer("${args.htmlid}", "${instance.object.id}");//]]</script><div class="dashlet"> <div class="title">${msg("label.title")}</div> <div class="body scrollable"> <p>${msg("label.hello")} ${name!''}!</p> </div></div>

We can access the strings defined in the properties files using the msg variable, and use variables from the model

Files involved - One file at a time

mydashlet.properties

label.title=My Dashletlabel.hello=Hello

We should put all the strings of our dashlet in the properties file, so it can be easily translated

Support for more languages can be added creating more properties files:

● mydashlet_ca.properties● mydashlet_es.properties

Deploy to Alfresco Share

Copy all four files inside:

<ALF_HOME>/tomcat/shared/classes/alfresco/web-extension/site-webscripts/com/jordiv/

Replace com/jordiv by your domain

Restart Alfresco Share or click the "Refresh Web Scripts" button (http://<server>:8080/share/page/index) and it will be available in user's customize dashboard

This is not the best way to deploy a dashlet into Alfresco Share, just the simplest one

What's next - Where to look now

Dashlets can be much more complex...

stats-dashlet:http://code.google.com/p/stats-dashlet/

share-extras:http://code.google.com/p/share-extras/

Alfresco Forums:https://forums.alfresco.com/en/

Alfresco Wiki:http://wiki.alfresco.com/