Hi!
Last nite I was trying to obtain/to make a info.magnolia.cms.gui.control.Tree control not to display
a <select/> tag for some columns.
After some investigation, the only solution that I have figured out was to extend the control and
override the getHtmlHeader(), getHtmlFooter(), getHtmlChildren() and getHtmlChildrenOfOneType(), but
copy some of the code in there.
I couldn't do this, as it may open the door to so many problem. Instead I come up with a `crazy´
idea: what if the control renders his content through some templates and it is just passing to that
templates the parameters it needs.
I have jumped to try this idea with FreeMarker (the reasons for choosing FreeMarker over Velocity
are not subject to this mail ;-) ).
Indeed there are a couple of simple things to be done to enable this (I can say under 50 lines of
code). But the final solution is looking great - at least in my opinion:
the extended Tree control is reduced with over 450lines (all those meant to create HTML output) and
these were replaced with 3 FreeMarker templates that are not longer than 50-80 lines. Even more
important, doing this will allow me to make my control render in whatever format I want it to. Plus,
I can still have the other controls render their content inside the template (as FreeMarker allows
me to call methods on objects). And last, but not least it became readable (again my opinion).
Here is a snippet:
[freemarker]
<#-- initialize js tree object -->
<script type="text/javascript">
var ${tree.javascriptTree} = new mgnlTree('${tree.repository}', '${tree.path}',
'${tree.javascriptTree}', ${tree.height}, '${tree.name}', ${tree.browseMode?string});
<#-- add columns to tree object -->
<#list tree.getColumns() as col>
<#if col.name?exists>
<#assign col_name = col.name>
<#else>
<#assign col_name = "null">
</#if>
${tree.javascriptTree}.columns[${col_index}] = new mgnlTreeColumn(${col.width},
'${col.htmlEdit}', '${col_name}', ${col.isMeta?string}, ${col.isLabel?string},
${col.isNodeDataValue?string}, ${col.isNodeDataType?string});
</#list>
mgnlTreeControls['${tree.javascriptTree}']=${tree.javascriptTree};
<#-- js is not run on remote request TODO: deal with the above-->
<#assign tree_selectedPath = "null" >
<#if tree.pathSelected?exists>
<#assign tree_selectedPath = tree.pathSelected>
</#if>
${tree.javascriptTree}.selectNode('${tree_selectedPath}');
</script>
[/freemarker]
and here is its correspondent in the Tree control:
[code]
// initialize js tree object
html.append("<script type=\"text/javascript\">"); //$NON-NLS-1$
html.append("var " //$NON-NLS-1$
+ this.getJavascriptTree() + "=new mgnlTree('" //$NON-NLS-1$
+ this.getRepository() + "','" //$NON-NLS-1$
+ this.getPath() + "','" //$NON-NLS-1$
+ this.getJavascriptTree() + "'," //$NON-NLS-1$
+ this.getHeight() + "," //$NON-NLS-1$
+ "'" + this.getName() + "'," + this.isBrowseMode() + ");");
//$NON-NLS-1$
// add columns to tree object
for (int i = 0; i < this.getColumns().size(); i++) {
TreeColumn tc = this.getColumns(i);
html.append(this.getJavascriptTree() + ".columns[" //$NON-NLS-1$
+ i + "]=new mgnlTreeColumn(" //$NON-NLS-1$
+ tc.getWidth() + ",'" //$NON-NLS-1$
+ tc.getHtmlEdit() + "','" //$NON-NLS-1$
+ tc.getName() + "'," //$NON-NLS-1$
+ tc.getIsMeta() + "," //$NON-NLS-1$
+ tc.getIsLabel() + "," //$NON-NLS-1$
+ tc.getIsNodeDataValue() + "," //$NON-NLS-1$
+ tc.getIsNodeDataType() + ");"); //$NON-NLS-1$
}
html.append("mgnlTreeControls['" + this.getJavascriptTree() + "']=" +
this.getJavascriptTree() + ";\n"); //$NON-NLS-1$ //$NON-NLS-2$ //$NON-NLS-3$
// js is not run on remote request
html.append(this.getJavascriptTree() + ".selectNode('" + this.getPathSelected() + "');");
//$NON-NLS-1$ //$NON-NLS-2$
html.append("</script>"); //$NON-NLS-1$
[/code]
I would like to find out what do you think about this?
cheers,
./alex
--
.w( the_mindstorm )p.
----------------------------------------------------------------
for list details see
http://www.magnolia.info/en/magnolia/developer.html
----------------------------------------------------------------
