1
No coding necessaryBuilding user macros and dynamic reports inside Confluence
2
Charles HallWiki Project ManagerAstrium
Who we are
3
Europe’s leading satellite manufacturer, number 3 worldwide.
www.astrium.eads.net
Agenda
•What is a user macro?
•Worked example – colored tables
•Worked example – watermark for wiki pages
•Showcase
4
User macros
•What is a user macro?• Added functionality• Removes complexity for authors• Facilitates re-use
•Restrictions• Used by users but…• …installed by system admins
5
User macros
•Where can they be used?• Pages• Templates• In other user macros
But not…• Custom HTML (administration screen)
•What do they consist of?• HTML• Javascript• Velocity Template Language (VTL)• References to Confluence objects
6
Complexity vs Functionality
7
Standard Wiki markup
{html} User macros
Custom plugins
Capability
Low
High
Functionality
Effort
HighComplexity
An example
8
A performance testing tool – {response-time}
See your cheat sheet for details of this macro
Introducing jQuery
“I thought you said no coding?”
•A Javascript library for simplifying HTML document traversal, event handling, and adding AJAX support easily
•Already used by Confluence•Minimizes Javascript coding
9
Worked example 1 – colored tables
10
No more boring tables!
Worked example 1 – colored tables
11
Listing 2
## Macro name: color-table## Macro has a body: N## Body format: n/a## Output: HTML#### Developed by: Charles Hall## Developed for: All users## Date created: 23/02/2010## Installed by: Charles Hall
## Apply coloring to alternate rows of tables.
<script type="text/javascript" defer="defer"> jQuery(document).ready(function() { jQuery("tr:even").css("background-color", "#318db6"); jQuery("tr:odd").css("background-color", "#f86a46"); });</script>
Comment header
Worked example 1 – side effects
12
Test, test then test some more!
Firebug to the rescue
13
Pinpoint the table(s) wewant to modify
Point & Click
Worked example 1 – revised version
14
Listing 2
## Macro name: color-table## Macro has a body: N## Body format: n/a## Output: HTML#### Developed by: Charles Hall## Developed for: All users## Date created: 23/02/2010## Installed by: Charles Hall
## Apply coloring to alternate rows of any tables with the class of confluenceTable.
<script type="text/javascript" defer="defer"> jQuery(document).ready(function() { jQuery("table.confluenceTable tr:nth-child (odd)").css("background-color", "#f86a46");
jQuery("table.confluenceTable tr:nth-child (even)").css("background-color", "#318db6");
});</script>
element.class
Worked example 1 – Accepting parameters
15
{color-table:A2C1D5|BFEBEF}
Worked example 1 – Accepting parameters
16
Listing 2
## Apply coloring to alternate rows of any tables with the class of confluenceTable.
#set($oddcolor= $param0)#set($evencolor= $param1)
## Check for valid odd color, otherwise use default#if (!$oddcolor) #set ($oddcolor="ffffff")#end
## Check for valid even color, otherwise use default#if (!$evencolor) #set ($evencolor="ededed")#end
Worked Example 2 - Using Confluence objects
17
Worked example 2 – Referencing the image
18
Listing 3
#set($image= $param0)#set($repeat = $param1)#set($minheight= $param2)
<script type="text/javascript" defer="defer">jQuery(document).ready(function(){jQuery('#mainViewPane').css('background-image', 'url($config.getBaseUrl()$content.getAttachmentNamed("$image").getDownloadPath())');
…
2 strings joined together
{watermark:draft.gif|no-repeat|1000}
Worked example 2 – Setting the repeat behaviour
19
Listing 3
#set($repeat = $param1)…
## Add the specified repeat behaviour#if ($repeat) jQuery('#mainViewPane').css('background-repeat', '$repeat');#end
…
Worked example 2 – Specifying a minimum height
20
Listing 3
#set($minheight = $param2)…
## Check for a specified minimum height#if ($minheight) jQuery('#mainViewPane').css('height', '$minheight');#end
…
Worked example 2 – reusing
21
How about defining some standard watermarks to help users?• Draft • Company logo
Could we make the syntax easier too?
• {draft-watermark}• {company-watermark}
Worked example 2 – reusing
22
Listing 3
…
## Check for full image path or attachment name#if($image.startsWith("http",0))#set($url=$image)#else#set($url=$config.getBaseUrl()+$content.getAttachmentNamed("$image").getDownloadPath())
#end…
Worked example 2 – reusing
23
Listing 4
## Macro name: draft-watermark## Macro has a body: N## Body format: n/a## Output: HTML#### Developed by: Charles Hall## Developed for: Astrium wiki## Date created: 19/04/2010## Installed by: Charles Hall
## N.B. Calls the watermark user macro## draft.gif must reside in "company" space
#set($url="http://globalcorp.com/confluence/download/attachments/74416134/draft.gif")
$action.getHelper().renderConfluenceMacro("{watermark:$url|no-repeat|1000}")
Calling the existing user macro
Showcase
24
Gradient background
25
Page theme
26
Client-side RSS feed reader
27
Tweaking another plug-in
28
Tweaking a standard feature
In summary
30
•Add real functionality•Users can control behaviour•Access to some Confluence objects•Can perform useful UI tweaks•Can be re-used in other macros
Useful resources•See your cheat sheet
Building Awesome Dashboards
with Confluence
Jim Severino, Atlassian
ConfluenceFree Plugins
Your Data
= Awesome
+
JDBC
1. SQL
2. Chart
3. Run
4. Scripting
Plugins For Reporting:
{sql}
DB
JDBC
Wiki
Plugin: SQL
{sql} Table
DB
JDBCJDBC
DB
Plugin: SQL
{chart}
{sql} Table
DB
Plugin: Chart
{chart}
{sql} Table
DB
Plugin: Chart
https://confluence.foo.com/FOO/Sales+Report?
run_1_category=motorcycles&run_1=run
https://confluence.foo.com/FOO/Sales+Report
?run_1_category=motorcycles
&run_1_foo=...&run_1_bar=...Other Parameters!
{sql} Table
DB
{run} {chart}
Plugin: Run
Scripting
Text
Image (c) United Feature Comics
Rule #1:Macro Security
Recommendation:Use the
Macro Security Plugin.
Rule #2:Datasource Security
Rule #3:Summary Databases
Recommendation:Run Reports off a Summary Database
1. SQL
2. Chart
3. Run
4. Scripting
Plugins For Reporting:
http://bit.ly/
howto-report